@jenesei-software/jenesei-kit-react 2.3.0 → 2.3.2

package/build/{context-app-Dsa1tKlU.cjs.map → context-app-29ajupjq.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"context-app-Dsa1tKlU.cjs","names":[],"sources":["../src/contexts/context-app/context.styles.ts","../src/contexts/context-app/context.tsx","../src/contexts/context-app/context.hooks.ts"],"sourcesContent":["import { CSS_VARS, IThemePalette } from '@local/styles/utils';\n\nimport { CSSProperties } from 'react';\n\nimport { IAppProviderOutletStyled } from './context.types';\n\ntype IAppOutletParts = IAppProviderOutletStyled;\n\nconst toPx = (value?: number | string | null) => (typeof value === 'number' ? `${value}px` : (value ?? '0px'));\n\nconst generateGridTemplateAreas = (props: IAppOutletParts) => {\n  return `\n    \"notification notification notification\"\n    \"${props.leftAside?.isTopHeader ? 'leftAside' : 'header'} header ${props.rightAside?.isTopHeader ? 'rightAside' : 'header'}\"\n    \"${props.leftAside?.isTopHeader ? 'leftAside' : props.leftAside?.isTopNav ? 'leftAside' : 'nav'} nav ${props.rightAside?.isTopHeader ? 'rightAside' : props.rightAside?.isTopNav ? 'rightAside' : 'nav'}\"\n    \"leftAside children rightAside\"\n    \"${props.leftAside?.isTopFooter ? 'leftAside' : 'footer'} footer ${props.rightAside?.isTopFooter ? 'rightAside' : 'footer'}\"\n  `;\n};\n\nexport const getProviderAppWrapperStyle = (bgColor: IThemePalette, bgImage: string | null): CSSProperties => ({\n  backgroundColor: CSS_VARS.palette[bgColor],\n  backgroundImage: bgImage ? `url(${bgImage})` : undefined,\n  backgroundSize: 'cover',\n  backgroundPosition: 'center',\n  backgroundRepeat: 'no-repeat',\n});\n\nexport const getProviderAppOutletStyle = (props: IAppOutletParts): CSSProperties => ({\n  gridTemplateAreas: generateGridTemplateAreas(props),\n  gridTemplateColumns: `${toPx(props.leftAside?.length)} 1fr ${toPx(props.rightAside?.length)}`,\n  gridTemplateRows: `${toPx(props.notification?.length)} ${toPx(props.header?.length)} ${toPx(props.nav?.length)} 1fr ${toPx(props.footer?.length)}`,\n});\n\nexport const getProviderAppOutletChildrenStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.main?.zIndex ?? 'auto',\n  overflow: props.isScrollOutlet ? 'auto' : 'visible',\n});\n\nexport const getProviderAppOutletNotificationStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.notification?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletHeaderStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.header?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletFooterStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.footer?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletNavStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.nav?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletLeftAsideStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.leftAside?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletRightAsideStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.rightAside?.zIndex ?? 'auto',\n});\n","import { IPreviewAdditional, Preview } from '@local/areas/preview';\nimport { useScreenWidth } from '@local/contexts/context-screen-width';\nimport { CSS_CLASS, CSS_VARS, IThemePalette } from '@local/styles/utils';\nimport { setClasses } from '@local/styles/utils/functions';\n\nimport { FC, useCallback, useEffect, useMemo, useState } from 'react';\nimport { createContext } from 'use-context-selector';\n\nimport {\n  getProviderAppOutletChildrenStyle,\n  getProviderAppOutletFooterStyle,\n  getProviderAppOutletHeaderStyle,\n  getProviderAppOutletLeftAsideStyle,\n  getProviderAppOutletNavStyle,\n  getProviderAppOutletNotificationStyle,\n  getProviderAppOutletRightAsideStyle,\n  getProviderAppOutletStyle,\n  getProviderAppWrapperStyle,\n} from './context.styles';\nimport { IAppContext, IAppProvider, IAppProviderElement, IAppProviderOutletStyled } from './context.types';\n\nexport const AppContext = createContext<IAppContext | null>(null);\n\nexport const ProviderApp: FC<IAppProvider> = (props) => {\n  const { bgColor, changeBgColor, historyBgColor, setDefaultBgColor } = useBgColor(props.defaultBgColor);\n  const { statusBarColor, changeStatusBarColor, historyStatusBarColor, setDefaultStatusBarColor } = useStatusBarColor(\n    props.defaultStatusBarColor,\n  );\n  const { bgImage, changeBgImage, historyBgImage, setDefaultBgImage } = useBgImage(props.defaultBgImage || null);\n  const { title, changeTitle, setHistoryTitle, setDefaultTitle } = useTitle(props.defaultTitle || null);\n  const { description, changeDescription, historyDescription, setDefaultDescription } = useDescription(\n    props.defaultDescription,\n  );\n  const { changePreview, previewProps } = usePreview(props.defaultPreview);\n\n  const { breakpoint, type, orientation } = useScreenWidth(['breakpoint', 'type', 'orientation']);\n\n  const getValueByBreakpoint = useCallback(\n    (lengthByBreakpoint: IAppProviderElement['length']) => {\n      if (!lengthByBreakpoint) return null;\n      if (type === 'orientation' && lengthByBreakpoint.orientation) {\n        const value = lengthByBreakpoint.orientation?.[orientation];\n        return value ?? null;\n      }\n      if (lengthByBreakpoint.breakpoint && lengthByBreakpoint.breakpoint) {\n        if (breakpoint === 'default') return lengthByBreakpoint.default ?? null;\n        const value = lengthByBreakpoint.breakpoint?.[breakpoint];\n        return value ?? null;\n      }\n    },\n    [breakpoint, orientation, type],\n  );\n\n  const outletStyledProps: IAppProviderOutletStyled = useMemo(\n    () => ({\n      isScrollOutlet: props.isScrollOutlet,\n      main: props.main,\n      notification: props.notification\n        ? {\n            component: props.notification.component,\n            length: getValueByBreakpoint(props.notification.length),\n            zIndex: props.notification.zIndex,\n          }\n        : undefined,\n      header: props.header\n        ? {\n            component: props.header.component,\n            length: getValueByBreakpoint(props.header.length),\n            zIndex: props.header.zIndex,\n          }\n        : undefined,\n      nav: props.nav\n        ? {\n            component: props.nav.component,\n            length: getValueByBreakpoint(props.nav.length),\n            zIndex: props.nav.zIndex,\n          }\n        : undefined,\n      footer: props.footer\n        ? {\n            component: props.footer.component,\n            length: getValueByBreakpoint(props.footer.length),\n            zIndex: props.footer.zIndex,\n          }\n        : undefined,\n      leftAside: props.leftAside\n        ? {\n            component: props.leftAside.component,\n            length: getValueByBreakpoint(props.leftAside.length),\n            zIndex: props.leftAside.zIndex,\n            isTopHeader: props.leftAside.isTopHeader,\n            isTopFooter: props.leftAside.isTopFooter,\n            isTopNav: props.leftAside.isTopNav,\n          }\n        : undefined,\n      rightAside: props.rightAside\n        ? {\n            component: props.rightAside.component,\n            length: getValueByBreakpoint(props.rightAside.length),\n            zIndex: props.rightAside.zIndex,\n            isTopHeader: props.rightAside.isTopHeader,\n            isTopFooter: props.rightAside.isTopFooter,\n            isTopNav: props.rightAside.isTopNav,\n          }\n        : undefined,\n    }),\n    [\n      props.footer,\n      props.header,\n      props.leftAside,\n      props.main,\n      props.nav,\n      props.notification,\n      props.rightAside,\n      props.isScrollOutlet,\n      getValueByBreakpoint,\n    ],\n  );\n\n  return (\n    <AppContext.Provider\n      value={{\n        changePreview,\n        changeStatusBarColor,\n        changeBgColor,\n        changeBgImage,\n        changeTitle,\n        changeDescription,\n        historyStatusBarColor,\n        historyBgColor,\n        historyBgImage,\n        setHistoryTitle,\n        historyDescription,\n        setDefaultStatusBarColor,\n        setDefaultBgColor,\n        setDefaultBgImage,\n        setDefaultTitle,\n        setDefaultDescription,\n      }}\n    >\n      <title>{title}</title>\n      <meta name='description' content={description} />\n      <meta name='theme-color' content={CSS_VARS.palette[statusBarColor]} />\n      <meta name='apple-mobile-web-app-status-bar-style' content='default' />\n      <meta name='mobile-web-app-capable' content='yes' />\n      <Preview {...previewProps}>\n        <div className={CSS_CLASS.context.app.wrapper} style={getProviderAppWrapperStyle(bgColor, bgImage)}>\n          <div\n            className={setClasses([CSS_CLASS.context.app.outlet, CSS_CLASS.transition.grid])}\n            style={getProviderAppOutletStyle(outletStyledProps)}\n          >\n            {outletStyledProps.notification?.length ? (\n              <section\n                className={CSS_CLASS.context.app.outletNotification}\n                style={getProviderAppOutletNotificationStyle(outletStyledProps)}\n              >\n                {props.notification?.component || null}\n              </section>\n            ) : null}\n\n            {outletStyledProps.header?.length ? (\n              <header\n                className={CSS_CLASS.context.app.outletHeader}\n                style={getProviderAppOutletHeaderStyle(outletStyledProps)}\n              >\n                {props.header?.component || null}\n              </header>\n            ) : null}\n\n            {outletStyledProps.nav?.length ? (\n              <nav className={CSS_CLASS.context.app.outletNav} style={getProviderAppOutletNavStyle(outletStyledProps)}>\n                {props.nav?.component || null}\n              </nav>\n            ) : null}\n\n            {outletStyledProps.leftAside?.length ? (\n              <aside\n                className={CSS_CLASS.context.app.outletLeftAside}\n                style={getProviderAppOutletLeftAsideStyle(outletStyledProps)}\n              >\n                {props.leftAside?.component || null}\n              </aside>\n            ) : null}\n\n            <main\n              className={CSS_CLASS.context.app.outletChildren}\n              style={getProviderAppOutletChildrenStyle(outletStyledProps)}\n            >\n              {props.children}\n            </main>\n\n            {outletStyledProps.rightAside?.length ? (\n              <aside\n                className={CSS_CLASS.context.app.outletRightAside}\n                style={getProviderAppOutletRightAsideStyle(outletStyledProps)}\n              >\n                {props.rightAside?.component || null}\n              </aside>\n            ) : null}\n\n            {outletStyledProps.footer?.length ? (\n              <footer\n                className={CSS_CLASS.context.app.outletFooter}\n                style={getProviderAppOutletFooterStyle(outletStyledProps)}\n              >\n                {props.footer?.component || null}\n              </footer>\n            ) : null}\n          </div>\n        </div>\n      </Preview>\n    </AppContext.Provider>\n  );\n};\n\n/**\n * Custom hook to manage preview properties.\n */\nconst usePreview = (defaultPreview: IAppProvider['defaultPreview']) => {\n  const [previewProps, setIPreview] = useState(defaultPreview || { visible: true, defaultVisible: true });\n\n  const changePreview = useCallback((newIPreview: IPreviewAdditional) => {\n    setIPreview(newIPreview);\n  }, []);\n\n  useEffect(() => {\n    if (defaultPreview) setIPreview(defaultPreview);\n  }, [defaultPreview]);\n\n  return { previewProps, changePreview };\n};\n\n/**\n * Custom hook to manage background color state with history tracking.\n */\ntype BgColorState = {\n  bgColor: IThemePalette;\n  bgColorHistory: IThemePalette[];\n  bgColorIndex: number;\n};\n\nexport const useBgColor = (defaultColor: IThemePalette) => {\n  const [state, setState] = useState<BgColorState>({\n    bgColor: defaultColor,\n    bgColorHistory: [defaultColor],\n    bgColorIndex: 0,\n  });\n\n  const changeBgColor = useCallback((color: IThemePalette) => {\n    setState((prev) => {\n      const newHistory = [...prev.bgColorHistory.slice(0, prev.bgColorIndex + 1), color];\n      return {\n        bgColor: color,\n        bgColorHistory: newHistory,\n        bgColorIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const historyBgColor = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.bgColorIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.bgColorHistory.length) {\n        return {\n          ...prev,\n          bgColor: prev.bgColorHistory[newIndex],\n          bgColorIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultBgColor = useCallback(() => {\n    setState({\n      bgColor: defaultColor,\n      bgColorHistory: [defaultColor],\n      bgColorIndex: 0,\n    });\n  }, [defaultColor]);\n\n  useEffect(() => {\n    setState({\n      bgColor: defaultColor,\n      bgColorHistory: [defaultColor],\n      bgColorIndex: 0,\n    });\n  }, [defaultColor]);\n\n  return {\n    bgColor: state.bgColor,\n    changeBgColor,\n    historyBgColor,\n    setDefaultBgColor,\n    bgColorIndex: state.bgColorIndex,\n  };\n};\n\n/**\n * Custom hook to manage the status bar color with history tracking.\n */\ntype StatusBarColorState = {\n  statusBarColor: IThemePalette;\n  statusBarColorHistory: IThemePalette[];\n  statusBarColorIndex: number;\n};\n\nexport const useStatusBarColor = (defaultColor: IThemePalette) => {\n  const [state, setState] = useState<StatusBarColorState>({\n    statusBarColor: defaultColor,\n    statusBarColorHistory: [defaultColor],\n    statusBarColorIndex: 0,\n  });\n\n  const changeStatusBarColor = useCallback((color: IThemePalette) => {\n    setState((prev) => {\n      const newHistory = [...prev.statusBarColorHistory.slice(0, prev.statusBarColorIndex + 1), color];\n      return {\n        statusBarColor: color,\n        statusBarColorHistory: newHistory,\n        statusBarColorIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const historyStatusBarColor = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.statusBarColorIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.statusBarColorHistory.length) {\n        return {\n          ...prev,\n          statusBarColor: prev.statusBarColorHistory[newIndex],\n          statusBarColorIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultStatusBarColor = useCallback(() => {\n    setState({\n      statusBarColor: defaultColor,\n      statusBarColorHistory: [defaultColor],\n      statusBarColorIndex: 0,\n    });\n  }, [defaultColor]);\n\n  useEffect(() => {\n    setState({\n      statusBarColor: defaultColor,\n      statusBarColorHistory: [defaultColor],\n      statusBarColorIndex: 0,\n    });\n  }, [defaultColor]);\n\n  return {\n    statusBarColor: state.statusBarColor,\n    changeStatusBarColor,\n    historyStatusBarColor,\n    setDefaultStatusBarColor,\n    statusBarColorIndex: state.statusBarColorIndex,\n  };\n};\n\n/**\n * Custom hook to manage background images with history.\n */\ntype BgImageState = {\n  bgImage: string | null;\n  bgImageHistory: (string | null)[];\n  bgImageIndex: number;\n};\n\nexport const useBgImage = (defaultImage: string | null) => {\n  const [state, setState] = useState<BgImageState>({\n    bgImage: defaultImage,\n    bgImageHistory: [defaultImage],\n    bgImageIndex: 0,\n  });\n\n  const changeBgImage = useCallback((image: string | null) => {\n    setState((prev) => {\n      const newHistory = [...prev.bgImageHistory.slice(0, prev.bgImageIndex + 1), image];\n      return {\n        bgImage: image,\n        bgImageHistory: newHistory,\n        bgImageIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const historyBgImage = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.bgImageIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.bgImageHistory.length) {\n        return {\n          ...prev,\n          bgImage: prev.bgImageHistory[newIndex],\n          bgImageIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultBgImage = useCallback(() => {\n    setState({\n      bgImage: defaultImage,\n      bgImageHistory: [defaultImage],\n      bgImageIndex: 0,\n    });\n  }, [defaultImage]);\n\n  useEffect(() => {\n    setState({\n      bgImage: defaultImage,\n      bgImageHistory: [defaultImage],\n      bgImageIndex: 0,\n    });\n  }, [defaultImage]);\n\n  return {\n    bgImage: state.bgImage,\n    changeBgImage,\n    historyBgImage,\n    setDefaultBgImage,\n    bgImageIndex: state.bgImageIndex,\n  };\n};\n\ntype TitleState = {\n  title: string | null;\n  titleHistory: (string | null)[];\n  titleIndex: number;\n};\n/**\n * Custom hook to manage the document title with history tracking.\n */\nconst useTitle = (defaultTitle: string | null) => {\n  const [state, setState] = useState<TitleState>({\n    title: defaultTitle,\n    titleHistory: [defaultTitle],\n    titleIndex: 0,\n  });\n\n  const changeTitle = useCallback((newTitle: string | null) => {\n    setState((prev) => {\n      const newHistory = [...prev.titleHistory.slice(0, prev.titleIndex + 1), newTitle];\n      return {\n        title: newTitle,\n        titleHistory: newHistory,\n        titleIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const setHistoryTitle = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.titleIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.titleHistory.length) {\n        return {\n          ...prev,\n          title: prev.titleHistory[newIndex],\n          titleIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultTitle = useCallback(() => {\n    setState({\n      title: defaultTitle,\n      titleHistory: [defaultTitle],\n      titleIndex: 0,\n    });\n  }, [defaultTitle]);\n\n  useEffect(() => {\n    setState({\n      title: defaultTitle,\n      titleHistory: [defaultTitle],\n      titleIndex: 0,\n    });\n  }, [defaultTitle]);\n\n  return {\n    title: state.title,\n    titleIndex: state.titleIndex,\n    titleHistory: state.titleHistory,\n    changeTitle,\n    setHistoryTitle,\n    setDefaultTitle,\n  };\n};\n\n/**\n * Custom hook to manage a description with history tracking.\n */\ntype DescriptionState = {\n  description: string;\n  descriptionHistory: string[];\n  descriptionIndex: number;\n};\n\nexport const useDescription = (defaultDescription: string) => {\n  const [state, setState] = useState<DescriptionState>({\n    description: defaultDescription,\n    descriptionHistory: [defaultDescription],\n    descriptionIndex: 0,\n  });\n\n  const changeDescription = useCallback((newDescription: string) => {\n    setState((prev) => {\n      const newHistory = [...prev.descriptionHistory.slice(0, prev.descriptionIndex + 1), newDescription];\n      return {\n        description: newDescription,\n        descriptionHistory: newHistory,\n        descriptionIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const historyDescription = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.descriptionIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.descriptionHistory.length) {\n        return {\n          ...prev,\n          description: prev.descriptionHistory[newIndex],\n          descriptionIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultDescription = useCallback(() => {\n    setState({\n      description: defaultDescription,\n      descriptionHistory: [defaultDescription],\n      descriptionIndex: 0,\n    });\n  }, [defaultDescription]);\n\n  useEffect(() => {\n    setState({\n      description: defaultDescription,\n      descriptionHistory: [defaultDescription],\n      descriptionIndex: 0,\n    });\n  }, [defaultDescription]);\n\n  return {\n    description: state.description,\n    changeDescription,\n    historyDescription,\n    setDefaultDescription,\n    descriptionIndex: state.descriptionIndex,\n  };\n};\n","import { useContextSelector } from 'use-context-selector';\n\nimport { AppContext } from './context';\nimport { IAppContext, IUseAppDependencies } from './context.types';\n\nexport const useApp = (props: IUseAppDependencies): IAppContext => {\n  const context = useContextSelector(AppContext, (v) => {\n    return v\n      ? props.reduce((acc, prop) => {\n          acc[prop] = v[prop];\n          return acc;\n        }, {} as any)\n      : null;\n  });\n  if (!context) {\n    throw new Error('useApp must be used within an AppContext');\n  }\n  return context;\n};\n"],"mappings":"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"}
+{"version":3,"file":"context-app-29ajupjq.cjs","names":[],"sources":["../src/contexts/context-app/context.styles.ts","../src/contexts/context-app/context.tsx","../src/contexts/context-app/context.hooks.ts"],"sourcesContent":["import { CSS_VARS, IThemePalette } from '@local/styles/utils';\n\nimport { CSSProperties } from 'react';\n\nimport { IAppProviderOutletStyled } from './context.types';\n\ntype IAppOutletParts = IAppProviderOutletStyled;\n\nconst toPx = (value?: number | string | null) => (typeof value === 'number' ? `${value}px` : (value ?? '0px'));\n\nconst generateGridTemplateAreas = (props: IAppOutletParts) => {\n  return `\n    \"notification notification notification\"\n    \"${props.leftAside?.isTopHeader ? 'leftAside' : 'header'} header ${props.rightAside?.isTopHeader ? 'rightAside' : 'header'}\"\n    \"${props.leftAside?.isTopHeader ? 'leftAside' : props.leftAside?.isTopNav ? 'leftAside' : 'nav'} nav ${props.rightAside?.isTopHeader ? 'rightAside' : props.rightAside?.isTopNav ? 'rightAside' : 'nav'}\"\n    \"leftAside children rightAside\"\n    \"${props.leftAside?.isTopFooter ? 'leftAside' : 'footer'} footer ${props.rightAside?.isTopFooter ? 'rightAside' : 'footer'}\"\n  `;\n};\n\nexport const getProviderAppWrapperStyle = (bgColor: IThemePalette, bgImage: string | null): CSSProperties => ({\n  backgroundColor: CSS_VARS.palette[bgColor],\n  backgroundImage: bgImage ? `url(${bgImage})` : undefined,\n  backgroundSize: 'cover',\n  backgroundPosition: 'center',\n  backgroundRepeat: 'no-repeat',\n});\n\nexport const getProviderAppOutletStyle = (props: IAppOutletParts): CSSProperties => ({\n  gridTemplateAreas: generateGridTemplateAreas(props),\n  gridTemplateColumns: `${toPx(props.leftAside?.length)} 1fr ${toPx(props.rightAside?.length)}`,\n  gridTemplateRows: `${toPx(props.notification?.length)} ${toPx(props.header?.length)} ${toPx(props.nav?.length)} 1fr ${toPx(props.footer?.length)}`,\n});\n\nexport const getProviderAppOutletChildrenStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.main?.zIndex ?? 'auto',\n  overflow: props.isScrollOutlet ? 'auto' : 'visible',\n});\n\nexport const getProviderAppOutletNotificationStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.notification?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletHeaderStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.header?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletFooterStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.footer?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletNavStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.nav?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletLeftAsideStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.leftAside?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletRightAsideStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.rightAside?.zIndex ?? 'auto',\n});\n","import { IPreviewAdditional, Preview } from '@local/areas/preview';\nimport { useScreenWidth } from '@local/contexts/context-screen-width';\nimport { CSS_CLASS, CSS_VARS, IThemePalette } from '@local/styles/utils';\nimport { setClasses } from '@local/styles/utils/functions';\n\nimport { FC, useCallback, useEffect, useMemo, useState } from 'react';\nimport { createContext } from 'use-context-selector';\n\nimport {\n  getProviderAppOutletChildrenStyle,\n  getProviderAppOutletFooterStyle,\n  getProviderAppOutletHeaderStyle,\n  getProviderAppOutletLeftAsideStyle,\n  getProviderAppOutletNavStyle,\n  getProviderAppOutletNotificationStyle,\n  getProviderAppOutletRightAsideStyle,\n  getProviderAppOutletStyle,\n  getProviderAppWrapperStyle,\n} from './context.styles';\nimport { IAppContext, IAppProvider, IAppProviderElement, IAppProviderOutletStyled } from './context.types';\n\nexport const AppContext = createContext<IAppContext | null>(null);\n\nexport const ProviderApp: FC<IAppProvider> = (props) => {\n  const { bgColor, changeBgColor, historyBgColor, setDefaultBgColor } = useBgColor(props.defaultBgColor);\n  const { statusBarColor, changeStatusBarColor, historyStatusBarColor, setDefaultStatusBarColor } = useStatusBarColor(\n    props.defaultStatusBarColor,\n  );\n  const { bgImage, changeBgImage, historyBgImage, setDefaultBgImage } = useBgImage(props.defaultBgImage || null);\n  const { title, changeTitle, setHistoryTitle, setDefaultTitle } = useTitle(props.defaultTitle || null);\n  const { description, changeDescription, historyDescription, setDefaultDescription } = useDescription(\n    props.defaultDescription,\n  );\n  const { changePreview, previewProps } = usePreview(props.defaultPreview);\n\n  const { breakpoint, type, orientation } = useScreenWidth(['breakpoint', 'type', 'orientation']);\n\n  const getValueByBreakpoint = useCallback(\n    (lengthByBreakpoint: IAppProviderElement['length']) => {\n      if (!lengthByBreakpoint) return null;\n      if (type === 'orientation' && lengthByBreakpoint.orientation) {\n        const value = lengthByBreakpoint.orientation?.[orientation];\n        return value ?? null;\n      }\n      if (lengthByBreakpoint.breakpoint && lengthByBreakpoint.breakpoint) {\n        if (breakpoint === 'default') return lengthByBreakpoint.default ?? null;\n        const value = lengthByBreakpoint.breakpoint?.[breakpoint];\n        return value ?? null;\n      }\n    },\n    [breakpoint, orientation, type],\n  );\n\n  const outletStyledProps: IAppProviderOutletStyled = useMemo(\n    () => ({\n      isScrollOutlet: props.isScrollOutlet,\n      main: props.main,\n      notification: props.notification\n        ? {\n            component: props.notification.component,\n            length: getValueByBreakpoint(props.notification.length),\n            zIndex: props.notification.zIndex,\n          }\n        : undefined,\n      header: props.header\n        ? {\n            component: props.header.component,\n            length: getValueByBreakpoint(props.header.length),\n            zIndex: props.header.zIndex,\n          }\n        : undefined,\n      nav: props.nav\n        ? {\n            component: props.nav.component,\n            length: getValueByBreakpoint(props.nav.length),\n            zIndex: props.nav.zIndex,\n          }\n        : undefined,\n      footer: props.footer\n        ? {\n            component: props.footer.component,\n            length: getValueByBreakpoint(props.footer.length),\n            zIndex: props.footer.zIndex,\n          }\n        : undefined,\n      leftAside: props.leftAside\n        ? {\n            component: props.leftAside.component,\n            length: getValueByBreakpoint(props.leftAside.length),\n            zIndex: props.leftAside.zIndex,\n            isTopHeader: props.leftAside.isTopHeader,\n            isTopFooter: props.leftAside.isTopFooter,\n            isTopNav: props.leftAside.isTopNav,\n          }\n        : undefined,\n      rightAside: props.rightAside\n        ? {\n            component: props.rightAside.component,\n            length: getValueByBreakpoint(props.rightAside.length),\n            zIndex: props.rightAside.zIndex,\n            isTopHeader: props.rightAside.isTopHeader,\n            isTopFooter: props.rightAside.isTopFooter,\n            isTopNav: props.rightAside.isTopNav,\n          }\n        : undefined,\n    }),\n    [\n      props.footer,\n      props.header,\n      props.leftAside,\n      props.main,\n      props.nav,\n      props.notification,\n      props.rightAside,\n      props.isScrollOutlet,\n      getValueByBreakpoint,\n    ],\n  );\n\n  return (\n    <AppContext.Provider\n      value={{\n        changePreview,\n        changeStatusBarColor,\n        changeBgColor,\n        changeBgImage,\n        changeTitle,\n        changeDescription,\n        historyStatusBarColor,\n        historyBgColor,\n        historyBgImage,\n        setHistoryTitle,\n        historyDescription,\n        setDefaultStatusBarColor,\n        setDefaultBgColor,\n        setDefaultBgImage,\n        setDefaultTitle,\n        setDefaultDescription,\n      }}\n    >\n      <title>{title}</title>\n      <meta name='description' content={description} />\n      <meta name='theme-color' content={CSS_VARS.palette[statusBarColor]} />\n      <meta name='apple-mobile-web-app-status-bar-style' content='default' />\n      <meta name='mobile-web-app-capable' content='yes' />\n      <Preview {...previewProps}>\n        <div className={CSS_CLASS.context.app.wrapper} style={getProviderAppWrapperStyle(bgColor, bgImage)}>\n          <div\n            className={setClasses([CSS_CLASS.context.app.outlet, CSS_CLASS.transition.grid])}\n            style={getProviderAppOutletStyle(outletStyledProps)}\n          >\n            {outletStyledProps.notification?.length ? (\n              <section\n                className={CSS_CLASS.context.app.outletNotification}\n                style={getProviderAppOutletNotificationStyle(outletStyledProps)}\n              >\n                {props.notification?.component || null}\n              </section>\n            ) : null}\n\n            {outletStyledProps.header?.length ? (\n              <header\n                className={CSS_CLASS.context.app.outletHeader}\n                style={getProviderAppOutletHeaderStyle(outletStyledProps)}\n              >\n                {props.header?.component || null}\n              </header>\n            ) : null}\n\n            {outletStyledProps.nav?.length ? (\n              <nav className={CSS_CLASS.context.app.outletNav} style={getProviderAppOutletNavStyle(outletStyledProps)}>\n                {props.nav?.component || null}\n              </nav>\n            ) : null}\n\n            {outletStyledProps.leftAside?.length ? (\n              <aside\n                className={CSS_CLASS.context.app.outletLeftAside}\n                style={getProviderAppOutletLeftAsideStyle(outletStyledProps)}\n              >\n                {props.leftAside?.component || null}\n              </aside>\n            ) : null}\n\n            <main\n              className={CSS_CLASS.context.app.outletChildren}\n              style={getProviderAppOutletChildrenStyle(outletStyledProps)}\n            >\n              {props.children}\n            </main>\n\n            {outletStyledProps.rightAside?.length ? (\n              <aside\n                className={CSS_CLASS.context.app.outletRightAside}\n                style={getProviderAppOutletRightAsideStyle(outletStyledProps)}\n              >\n                {props.rightAside?.component || null}\n              </aside>\n            ) : null}\n\n            {outletStyledProps.footer?.length ? (\n              <footer\n                className={CSS_CLASS.context.app.outletFooter}\n                style={getProviderAppOutletFooterStyle(outletStyledProps)}\n              >\n                {props.footer?.component || null}\n              </footer>\n            ) : null}\n          </div>\n        </div>\n      </Preview>\n    </AppContext.Provider>\n  );\n};\n\n/**\n * Custom hook to manage preview properties.\n */\nconst usePreview = (defaultPreview: IAppProvider['defaultPreview']) => {\n  const [previewProps, setIPreview] = useState(defaultPreview || { visible: true, defaultVisible: true });\n\n  const changePreview = useCallback((newIPreview: IPreviewAdditional) => {\n    setIPreview(newIPreview);\n  }, []);\n\n  useEffect(() => {\n    if (defaultPreview) setIPreview(defaultPreview);\n  }, [defaultPreview]);\n\n  return { previewProps, changePreview };\n};\n\n/**\n * Custom hook to manage background color state with history tracking.\n */\ntype BgColorState = {\n  bgColor: IThemePalette;\n  bgColorHistory: IThemePalette[];\n  bgColorIndex: number;\n};\n\nexport const useBgColor = (defaultColor: IThemePalette) => {\n  const [state, setState] = useState<BgColorState>({\n    bgColor: defaultColor,\n    bgColorHistory: [defaultColor],\n    bgColorIndex: 0,\n  });\n\n  const changeBgColor = useCallback((color: IThemePalette) => {\n    setState((prev) => {\n      const newHistory = [...prev.bgColorHistory.slice(0, prev.bgColorIndex + 1), color];\n      return {\n        bgColor: color,\n        bgColorHistory: newHistory,\n        bgColorIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const historyBgColor = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.bgColorIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.bgColorHistory.length) {\n        return {\n          ...prev,\n          bgColor: prev.bgColorHistory[newIndex],\n          bgColorIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultBgColor = useCallback(() => {\n    setState({\n      bgColor: defaultColor,\n      bgColorHistory: [defaultColor],\n      bgColorIndex: 0,\n    });\n  }, [defaultColor]);\n\n  useEffect(() => {\n    setState({\n      bgColor: defaultColor,\n      bgColorHistory: [defaultColor],\n      bgColorIndex: 0,\n    });\n  }, [defaultColor]);\n\n  return {\n    bgColor: state.bgColor,\n    changeBgColor,\n    historyBgColor,\n    setDefaultBgColor,\n    bgColorIndex: state.bgColorIndex,\n  };\n};\n\n/**\n * Custom hook to manage the status bar color with history tracking.\n */\ntype StatusBarColorState = {\n  statusBarColor: IThemePalette;\n  statusBarColorHistory: IThemePalette[];\n  statusBarColorIndex: number;\n};\n\nexport const useStatusBarColor = (defaultColor: IThemePalette) => {\n  const [state, setState] = useState<StatusBarColorState>({\n    statusBarColor: defaultColor,\n    statusBarColorHistory: [defaultColor],\n    statusBarColorIndex: 0,\n  });\n\n  const changeStatusBarColor = useCallback((color: IThemePalette) => {\n    setState((prev) => {\n      const newHistory = [...prev.statusBarColorHistory.slice(0, prev.statusBarColorIndex + 1), color];\n      return {\n        statusBarColor: color,\n        statusBarColorHistory: newHistory,\n        statusBarColorIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const historyStatusBarColor = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.statusBarColorIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.statusBarColorHistory.length) {\n        return {\n          ...prev,\n          statusBarColor: prev.statusBarColorHistory[newIndex],\n          statusBarColorIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultStatusBarColor = useCallback(() => {\n    setState({\n      statusBarColor: defaultColor,\n      statusBarColorHistory: [defaultColor],\n      statusBarColorIndex: 0,\n    });\n  }, [defaultColor]);\n\n  useEffect(() => {\n    setState({\n      statusBarColor: defaultColor,\n      statusBarColorHistory: [defaultColor],\n      statusBarColorIndex: 0,\n    });\n  }, [defaultColor]);\n\n  return {\n    statusBarColor: state.statusBarColor,\n    changeStatusBarColor,\n    historyStatusBarColor,\n    setDefaultStatusBarColor,\n    statusBarColorIndex: state.statusBarColorIndex,\n  };\n};\n\n/**\n * Custom hook to manage background images with history.\n */\ntype BgImageState = {\n  bgImage: string | null;\n  bgImageHistory: (string | null)[];\n  bgImageIndex: number;\n};\n\nexport const useBgImage = (defaultImage: string | null) => {\n  const [state, setState] = useState<BgImageState>({\n    bgImage: defaultImage,\n    bgImageHistory: [defaultImage],\n    bgImageIndex: 0,\n  });\n\n  const changeBgImage = useCallback((image: string | null) => {\n    setState((prev) => {\n      const newHistory = [...prev.bgImageHistory.slice(0, prev.bgImageIndex + 1), image];\n      return {\n        bgImage: image,\n        bgImageHistory: newHistory,\n        bgImageIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const historyBgImage = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.bgImageIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.bgImageHistory.length) {\n        return {\n          ...prev,\n          bgImage: prev.bgImageHistory[newIndex],\n          bgImageIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultBgImage = useCallback(() => {\n    setState({\n      bgImage: defaultImage,\n      bgImageHistory: [defaultImage],\n      bgImageIndex: 0,\n    });\n  }, [defaultImage]);\n\n  useEffect(() => {\n    setState({\n      bgImage: defaultImage,\n      bgImageHistory: [defaultImage],\n      bgImageIndex: 0,\n    });\n  }, [defaultImage]);\n\n  return {\n    bgImage: state.bgImage,\n    changeBgImage,\n    historyBgImage,\n    setDefaultBgImage,\n    bgImageIndex: state.bgImageIndex,\n  };\n};\n\ntype TitleState = {\n  title: string | null;\n  titleHistory: (string | null)[];\n  titleIndex: number;\n};\n/**\n * Custom hook to manage the document title with history tracking.\n */\nconst useTitle = (defaultTitle: string | null) => {\n  const [state, setState] = useState<TitleState>({\n    title: defaultTitle,\n    titleHistory: [defaultTitle],\n    titleIndex: 0,\n  });\n\n  const changeTitle = useCallback((newTitle: string | null) => {\n    setState((prev) => {\n      const newHistory = [...prev.titleHistory.slice(0, prev.titleIndex + 1), newTitle];\n      return {\n        title: newTitle,\n        titleHistory: newHistory,\n        titleIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const setHistoryTitle = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.titleIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.titleHistory.length) {\n        return {\n          ...prev,\n          title: prev.titleHistory[newIndex],\n          titleIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultTitle = useCallback(() => {\n    setState({\n      title: defaultTitle,\n      titleHistory: [defaultTitle],\n      titleIndex: 0,\n    });\n  }, [defaultTitle]);\n\n  useEffect(() => {\n    setState({\n      title: defaultTitle,\n      titleHistory: [defaultTitle],\n      titleIndex: 0,\n    });\n  }, [defaultTitle]);\n\n  return {\n    title: state.title,\n    titleIndex: state.titleIndex,\n    titleHistory: state.titleHistory,\n    changeTitle,\n    setHistoryTitle,\n    setDefaultTitle,\n  };\n};\n\n/**\n * Custom hook to manage a description with history tracking.\n */\ntype DescriptionState = {\n  description: string;\n  descriptionHistory: string[];\n  descriptionIndex: number;\n};\n\nexport const useDescription = (defaultDescription: string) => {\n  const [state, setState] = useState<DescriptionState>({\n    description: defaultDescription,\n    descriptionHistory: [defaultDescription],\n    descriptionIndex: 0,\n  });\n\n  const changeDescription = useCallback((newDescription: string) => {\n    setState((prev) => {\n      const newHistory = [...prev.descriptionHistory.slice(0, prev.descriptionIndex + 1), newDescription];\n      return {\n        description: newDescription,\n        descriptionHistory: newHistory,\n        descriptionIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const historyDescription = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.descriptionIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.descriptionHistory.length) {\n        return {\n          ...prev,\n          description: prev.descriptionHistory[newIndex],\n          descriptionIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultDescription = useCallback(() => {\n    setState({\n      description: defaultDescription,\n      descriptionHistory: [defaultDescription],\n      descriptionIndex: 0,\n    });\n  }, [defaultDescription]);\n\n  useEffect(() => {\n    setState({\n      description: defaultDescription,\n      descriptionHistory: [defaultDescription],\n      descriptionIndex: 0,\n    });\n  }, [defaultDescription]);\n\n  return {\n    description: state.description,\n    changeDescription,\n    historyDescription,\n    setDefaultDescription,\n    descriptionIndex: state.descriptionIndex,\n  };\n};\n","import { useContextSelector } from 'use-context-selector';\n\nimport { AppContext } from './context';\nimport { IAppContext, IUseAppDependencies } from './context.types';\n\nexport const useApp = (props: IUseAppDependencies): IAppContext => {\n  const context = useContextSelector(AppContext, (v) => {\n    return v\n      ? props.reduce((acc, prop) => {\n          acc[prop] = v[prop];\n          return acc;\n        }, {} as any)\n      : null;\n  });\n  if (!context) {\n    throw new Error('useApp must be used within an AppContext');\n  }\n  return context;\n};\n"],"mappings":"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"}

package/build/{context-app-C9XoarPw.js → context-app-CxNgCfd2.js}

@@ -1,6 +1,6 @@
 import { n as u, r as H } from "./utils-BRgi6734.js";
 import { t as V } from "./functions-DzX-pTN8.js";
-import { n as j } from "./preview-Bc2qdyd4.js";
+import { n as j } from "./preview-C-mtYSGG.js";
 import { n as E, t as W } from "./dist-ck-7oUux.js";
 import { t as _ } from "./context-screen-width-Cq_B7IVp.js";
 import { jsx as g, jsxs as f } from "react/jsx-runtime";
@@ -414,4 +414,4 @@ export {
   It as t
 };
 
-//# sourceMappingURL=context-app-C9XoarPw.js.map
+//# sourceMappingURL=context-app-CxNgCfd2.js.map

package/build/{context-app-C9XoarPw.js.map → context-app-CxNgCfd2.js.map}

@@ -1 +1 @@
-{"version":3,"file":"context-app-C9XoarPw.js","names":[],"sources":["../src/contexts/context-app/context.styles.ts","../src/contexts/context-app/context.tsx","../src/contexts/context-app/context.hooks.ts"],"sourcesContent":["import { CSS_VARS, IThemePalette } from '@local/styles/utils';\n\nimport { CSSProperties } from 'react';\n\nimport { IAppProviderOutletStyled } from './context.types';\n\ntype IAppOutletParts = IAppProviderOutletStyled;\n\nconst toPx = (value?: number | string | null) => (typeof value === 'number' ? `${value}px` : (value ?? '0px'));\n\nconst generateGridTemplateAreas = (props: IAppOutletParts) => {\n  return `\n    \"notification notification notification\"\n    \"${props.leftAside?.isTopHeader ? 'leftAside' : 'header'} header ${props.rightAside?.isTopHeader ? 'rightAside' : 'header'}\"\n    \"${props.leftAside?.isTopHeader ? 'leftAside' : props.leftAside?.isTopNav ? 'leftAside' : 'nav'} nav ${props.rightAside?.isTopHeader ? 'rightAside' : props.rightAside?.isTopNav ? 'rightAside' : 'nav'}\"\n    \"leftAside children rightAside\"\n    \"${props.leftAside?.isTopFooter ? 'leftAside' : 'footer'} footer ${props.rightAside?.isTopFooter ? 'rightAside' : 'footer'}\"\n  `;\n};\n\nexport const getProviderAppWrapperStyle = (bgColor: IThemePalette, bgImage: string | null): CSSProperties => ({\n  backgroundColor: CSS_VARS.palette[bgColor],\n  backgroundImage: bgImage ? `url(${bgImage})` : undefined,\n  backgroundSize: 'cover',\n  backgroundPosition: 'center',\n  backgroundRepeat: 'no-repeat',\n});\n\nexport const getProviderAppOutletStyle = (props: IAppOutletParts): CSSProperties => ({\n  gridTemplateAreas: generateGridTemplateAreas(props),\n  gridTemplateColumns: `${toPx(props.leftAside?.length)} 1fr ${toPx(props.rightAside?.length)}`,\n  gridTemplateRows: `${toPx(props.notification?.length)} ${toPx(props.header?.length)} ${toPx(props.nav?.length)} 1fr ${toPx(props.footer?.length)}`,\n});\n\nexport const getProviderAppOutletChildrenStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.main?.zIndex ?? 'auto',\n  overflow: props.isScrollOutlet ? 'auto' : 'visible',\n});\n\nexport const getProviderAppOutletNotificationStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.notification?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletHeaderStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.header?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletFooterStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.footer?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletNavStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.nav?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletLeftAsideStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.leftAside?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletRightAsideStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.rightAside?.zIndex ?? 'auto',\n});\n","import { IPreviewAdditional, Preview } from '@local/areas/preview';\nimport { useScreenWidth } from '@local/contexts/context-screen-width';\nimport { CSS_CLASS, CSS_VARS, IThemePalette } from '@local/styles/utils';\nimport { setClasses } from '@local/styles/utils/functions';\n\nimport { FC, useCallback, useEffect, useMemo, useState } from 'react';\nimport { createContext } from 'use-context-selector';\n\nimport {\n  getProviderAppOutletChildrenStyle,\n  getProviderAppOutletFooterStyle,\n  getProviderAppOutletHeaderStyle,\n  getProviderAppOutletLeftAsideStyle,\n  getProviderAppOutletNavStyle,\n  getProviderAppOutletNotificationStyle,\n  getProviderAppOutletRightAsideStyle,\n  getProviderAppOutletStyle,\n  getProviderAppWrapperStyle,\n} from './context.styles';\nimport { IAppContext, IAppProvider, IAppProviderElement, IAppProviderOutletStyled } from './context.types';\n\nexport const AppContext = createContext<IAppContext | null>(null);\n\nexport const ProviderApp: FC<IAppProvider> = (props) => {\n  const { bgColor, changeBgColor, historyBgColor, setDefaultBgColor } = useBgColor(props.defaultBgColor);\n  const { statusBarColor, changeStatusBarColor, historyStatusBarColor, setDefaultStatusBarColor } = useStatusBarColor(\n    props.defaultStatusBarColor,\n  );\n  const { bgImage, changeBgImage, historyBgImage, setDefaultBgImage } = useBgImage(props.defaultBgImage || null);\n  const { title, changeTitle, setHistoryTitle, setDefaultTitle } = useTitle(props.defaultTitle || null);\n  const { description, changeDescription, historyDescription, setDefaultDescription } = useDescription(\n    props.defaultDescription,\n  );\n  const { changePreview, previewProps } = usePreview(props.defaultPreview);\n\n  const { breakpoint, type, orientation } = useScreenWidth(['breakpoint', 'type', 'orientation']);\n\n  const getValueByBreakpoint = useCallback(\n    (lengthByBreakpoint: IAppProviderElement['length']) => {\n      if (!lengthByBreakpoint) return null;\n      if (type === 'orientation' && lengthByBreakpoint.orientation) {\n        const value = lengthByBreakpoint.orientation?.[orientation];\n        return value ?? null;\n      }\n      if (lengthByBreakpoint.breakpoint && lengthByBreakpoint.breakpoint) {\n        if (breakpoint === 'default') return lengthByBreakpoint.default ?? null;\n        const value = lengthByBreakpoint.breakpoint?.[breakpoint];\n        return value ?? null;\n      }\n    },\n    [breakpoint, orientation, type],\n  );\n\n  const outletStyledProps: IAppProviderOutletStyled = useMemo(\n    () => ({\n      isScrollOutlet: props.isScrollOutlet,\n      main: props.main,\n      notification: props.notification\n        ? {\n            component: props.notification.component,\n            length: getValueByBreakpoint(props.notification.length),\n            zIndex: props.notification.zIndex,\n          }\n        : undefined,\n      header: props.header\n        ? {\n            component: props.header.component,\n            length: getValueByBreakpoint(props.header.length),\n            zIndex: props.header.zIndex,\n          }\n        : undefined,\n      nav: props.nav\n        ? {\n            component: props.nav.component,\n            length: getValueByBreakpoint(props.nav.length),\n            zIndex: props.nav.zIndex,\n          }\n        : undefined,\n      footer: props.footer\n        ? {\n            component: props.footer.component,\n            length: getValueByBreakpoint(props.footer.length),\n            zIndex: props.footer.zIndex,\n          }\n        : undefined,\n      leftAside: props.leftAside\n        ? {\n            component: props.leftAside.component,\n            length: getValueByBreakpoint(props.leftAside.length),\n            zIndex: props.leftAside.zIndex,\n            isTopHeader: props.leftAside.isTopHeader,\n            isTopFooter: props.leftAside.isTopFooter,\n            isTopNav: props.leftAside.isTopNav,\n          }\n        : undefined,\n      rightAside: props.rightAside\n        ? {\n            component: props.rightAside.component,\n            length: getValueByBreakpoint(props.rightAside.length),\n            zIndex: props.rightAside.zIndex,\n            isTopHeader: props.rightAside.isTopHeader,\n            isTopFooter: props.rightAside.isTopFooter,\n            isTopNav: props.rightAside.isTopNav,\n          }\n        : undefined,\n    }),\n    [\n      props.footer,\n      props.header,\n      props.leftAside,\n      props.main,\n      props.nav,\n      props.notification,\n      props.rightAside,\n      props.isScrollOutlet,\n      getValueByBreakpoint,\n    ],\n  );\n\n  return (\n    <AppContext.Provider\n      value={{\n        changePreview,\n        changeStatusBarColor,\n        changeBgColor,\n        changeBgImage,\n        changeTitle,\n        changeDescription,\n        historyStatusBarColor,\n        historyBgColor,\n        historyBgImage,\n        setHistoryTitle,\n        historyDescription,\n        setDefaultStatusBarColor,\n        setDefaultBgColor,\n        setDefaultBgImage,\n        setDefaultTitle,\n        setDefaultDescription,\n      }}\n    >\n      <title>{title}</title>\n      <meta name='description' content={description} />\n      <meta name='theme-color' content={CSS_VARS.palette[statusBarColor]} />\n      <meta name='apple-mobile-web-app-status-bar-style' content='default' />\n      <meta name='mobile-web-app-capable' content='yes' />\n      <Preview {...previewProps}>\n        <div className={CSS_CLASS.context.app.wrapper} style={getProviderAppWrapperStyle(bgColor, bgImage)}>\n          <div\n            className={setClasses([CSS_CLASS.context.app.outlet, CSS_CLASS.transition.grid])}\n            style={getProviderAppOutletStyle(outletStyledProps)}\n          >\n            {outletStyledProps.notification?.length ? (\n              <section\n                className={CSS_CLASS.context.app.outletNotification}\n                style={getProviderAppOutletNotificationStyle(outletStyledProps)}\n              >\n                {props.notification?.component || null}\n              </section>\n            ) : null}\n\n            {outletStyledProps.header?.length ? (\n              <header\n                className={CSS_CLASS.context.app.outletHeader}\n                style={getProviderAppOutletHeaderStyle(outletStyledProps)}\n              >\n                {props.header?.component || null}\n              </header>\n            ) : null}\n\n            {outletStyledProps.nav?.length ? (\n              <nav className={CSS_CLASS.context.app.outletNav} style={getProviderAppOutletNavStyle(outletStyledProps)}>\n                {props.nav?.component || null}\n              </nav>\n            ) : null}\n\n            {outletStyledProps.leftAside?.length ? (\n              <aside\n                className={CSS_CLASS.context.app.outletLeftAside}\n                style={getProviderAppOutletLeftAsideStyle(outletStyledProps)}\n              >\n                {props.leftAside?.component || null}\n              </aside>\n            ) : null}\n\n            <main\n              className={CSS_CLASS.context.app.outletChildren}\n              style={getProviderAppOutletChildrenStyle(outletStyledProps)}\n            >\n              {props.children}\n            </main>\n\n            {outletStyledProps.rightAside?.length ? (\n              <aside\n                className={CSS_CLASS.context.app.outletRightAside}\n                style={getProviderAppOutletRightAsideStyle(outletStyledProps)}\n              >\n                {props.rightAside?.component || null}\n              </aside>\n            ) : null}\n\n            {outletStyledProps.footer?.length ? (\n              <footer\n                className={CSS_CLASS.context.app.outletFooter}\n                style={getProviderAppOutletFooterStyle(outletStyledProps)}\n              >\n                {props.footer?.component || null}\n              </footer>\n            ) : null}\n          </div>\n        </div>\n      </Preview>\n    </AppContext.Provider>\n  );\n};\n\n/**\n * Custom hook to manage preview properties.\n */\nconst usePreview = (defaultPreview: IAppProvider['defaultPreview']) => {\n  const [previewProps, setIPreview] = useState(defaultPreview || { visible: true, defaultVisible: true });\n\n  const changePreview = useCallback((newIPreview: IPreviewAdditional) => {\n    setIPreview(newIPreview);\n  }, []);\n\n  useEffect(() => {\n    if (defaultPreview) setIPreview(defaultPreview);\n  }, [defaultPreview]);\n\n  return { previewProps, changePreview };\n};\n\n/**\n * Custom hook to manage background color state with history tracking.\n */\ntype BgColorState = {\n  bgColor: IThemePalette;\n  bgColorHistory: IThemePalette[];\n  bgColorIndex: number;\n};\n\nexport const useBgColor = (defaultColor: IThemePalette) => {\n  const [state, setState] = useState<BgColorState>({\n    bgColor: defaultColor,\n    bgColorHistory: [defaultColor],\n    bgColorIndex: 0,\n  });\n\n  const changeBgColor = useCallback((color: IThemePalette) => {\n    setState((prev) => {\n      const newHistory = [...prev.bgColorHistory.slice(0, prev.bgColorIndex + 1), color];\n      return {\n        bgColor: color,\n        bgColorHistory: newHistory,\n        bgColorIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const historyBgColor = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.bgColorIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.bgColorHistory.length) {\n        return {\n          ...prev,\n          bgColor: prev.bgColorHistory[newIndex],\n          bgColorIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultBgColor = useCallback(() => {\n    setState({\n      bgColor: defaultColor,\n      bgColorHistory: [defaultColor],\n      bgColorIndex: 0,\n    });\n  }, [defaultColor]);\n\n  useEffect(() => {\n    setState({\n      bgColor: defaultColor,\n      bgColorHistory: [defaultColor],\n      bgColorIndex: 0,\n    });\n  }, [defaultColor]);\n\n  return {\n    bgColor: state.bgColor,\n    changeBgColor,\n    historyBgColor,\n    setDefaultBgColor,\n    bgColorIndex: state.bgColorIndex,\n  };\n};\n\n/**\n * Custom hook to manage the status bar color with history tracking.\n */\ntype StatusBarColorState = {\n  statusBarColor: IThemePalette;\n  statusBarColorHistory: IThemePalette[];\n  statusBarColorIndex: number;\n};\n\nexport const useStatusBarColor = (defaultColor: IThemePalette) => {\n  const [state, setState] = useState<StatusBarColorState>({\n    statusBarColor: defaultColor,\n    statusBarColorHistory: [defaultColor],\n    statusBarColorIndex: 0,\n  });\n\n  const changeStatusBarColor = useCallback((color: IThemePalette) => {\n    setState((prev) => {\n      const newHistory = [...prev.statusBarColorHistory.slice(0, prev.statusBarColorIndex + 1), color];\n      return {\n        statusBarColor: color,\n        statusBarColorHistory: newHistory,\n        statusBarColorIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const historyStatusBarColor = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.statusBarColorIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.statusBarColorHistory.length) {\n        return {\n          ...prev,\n          statusBarColor: prev.statusBarColorHistory[newIndex],\n          statusBarColorIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultStatusBarColor = useCallback(() => {\n    setState({\n      statusBarColor: defaultColor,\n      statusBarColorHistory: [defaultColor],\n      statusBarColorIndex: 0,\n    });\n  }, [defaultColor]);\n\n  useEffect(() => {\n    setState({\n      statusBarColor: defaultColor,\n      statusBarColorHistory: [defaultColor],\n      statusBarColorIndex: 0,\n    });\n  }, [defaultColor]);\n\n  return {\n    statusBarColor: state.statusBarColor,\n    changeStatusBarColor,\n    historyStatusBarColor,\n    setDefaultStatusBarColor,\n    statusBarColorIndex: state.statusBarColorIndex,\n  };\n};\n\n/**\n * Custom hook to manage background images with history.\n */\ntype BgImageState = {\n  bgImage: string | null;\n  bgImageHistory: (string | null)[];\n  bgImageIndex: number;\n};\n\nexport const useBgImage = (defaultImage: string | null) => {\n  const [state, setState] = useState<BgImageState>({\n    bgImage: defaultImage,\n    bgImageHistory: [defaultImage],\n    bgImageIndex: 0,\n  });\n\n  const changeBgImage = useCallback((image: string | null) => {\n    setState((prev) => {\n      const newHistory = [...prev.bgImageHistory.slice(0, prev.bgImageIndex + 1), image];\n      return {\n        bgImage: image,\n        bgImageHistory: newHistory,\n        bgImageIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const historyBgImage = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.bgImageIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.bgImageHistory.length) {\n        return {\n          ...prev,\n          bgImage: prev.bgImageHistory[newIndex],\n          bgImageIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultBgImage = useCallback(() => {\n    setState({\n      bgImage: defaultImage,\n      bgImageHistory: [defaultImage],\n      bgImageIndex: 0,\n    });\n  }, [defaultImage]);\n\n  useEffect(() => {\n    setState({\n      bgImage: defaultImage,\n      bgImageHistory: [defaultImage],\n      bgImageIndex: 0,\n    });\n  }, [defaultImage]);\n\n  return {\n    bgImage: state.bgImage,\n    changeBgImage,\n    historyBgImage,\n    setDefaultBgImage,\n    bgImageIndex: state.bgImageIndex,\n  };\n};\n\ntype TitleState = {\n  title: string | null;\n  titleHistory: (string | null)[];\n  titleIndex: number;\n};\n/**\n * Custom hook to manage the document title with history tracking.\n */\nconst useTitle = (defaultTitle: string | null) => {\n  const [state, setState] = useState<TitleState>({\n    title: defaultTitle,\n    titleHistory: [defaultTitle],\n    titleIndex: 0,\n  });\n\n  const changeTitle = useCallback((newTitle: string | null) => {\n    setState((prev) => {\n      const newHistory = [...prev.titleHistory.slice(0, prev.titleIndex + 1), newTitle];\n      return {\n        title: newTitle,\n        titleHistory: newHistory,\n        titleIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const setHistoryTitle = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.titleIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.titleHistory.length) {\n        return {\n          ...prev,\n          title: prev.titleHistory[newIndex],\n          titleIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultTitle = useCallback(() => {\n    setState({\n      title: defaultTitle,\n      titleHistory: [defaultTitle],\n      titleIndex: 0,\n    });\n  }, [defaultTitle]);\n\n  useEffect(() => {\n    setState({\n      title: defaultTitle,\n      titleHistory: [defaultTitle],\n      titleIndex: 0,\n    });\n  }, [defaultTitle]);\n\n  return {\n    title: state.title,\n    titleIndex: state.titleIndex,\n    titleHistory: state.titleHistory,\n    changeTitle,\n    setHistoryTitle,\n    setDefaultTitle,\n  };\n};\n\n/**\n * Custom hook to manage a description with history tracking.\n */\ntype DescriptionState = {\n  description: string;\n  descriptionHistory: string[];\n  descriptionIndex: number;\n};\n\nexport const useDescription = (defaultDescription: string) => {\n  const [state, setState] = useState<DescriptionState>({\n    description: defaultDescription,\n    descriptionHistory: [defaultDescription],\n    descriptionIndex: 0,\n  });\n\n  const changeDescription = useCallback((newDescription: string) => {\n    setState((prev) => {\n      const newHistory = [...prev.descriptionHistory.slice(0, prev.descriptionIndex + 1), newDescription];\n      return {\n        description: newDescription,\n        descriptionHistory: newHistory,\n        descriptionIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const historyDescription = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.descriptionIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.descriptionHistory.length) {\n        return {\n          ...prev,\n          description: prev.descriptionHistory[newIndex],\n          descriptionIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultDescription = useCallback(() => {\n    setState({\n      description: defaultDescription,\n      descriptionHistory: [defaultDescription],\n      descriptionIndex: 0,\n    });\n  }, [defaultDescription]);\n\n  useEffect(() => {\n    setState({\n      description: defaultDescription,\n      descriptionHistory: [defaultDescription],\n      descriptionIndex: 0,\n    });\n  }, [defaultDescription]);\n\n  return {\n    description: state.description,\n    changeDescription,\n    historyDescription,\n    setDefaultDescription,\n    descriptionIndex: state.descriptionIndex,\n  };\n};\n","import { useContextSelector } from 'use-context-selector';\n\nimport { AppContext } from './context';\nimport { IAppContext, IUseAppDependencies } from './context.types';\n\nexport const useApp = (props: IUseAppDependencies): IAppContext => {\n  const context = useContextSelector(AppContext, (v) => {\n    return v\n      ? props.reduce((acc, prop) => {\n          acc[prop] = v[prop];\n          return acc;\n        }, {} as any)\n      : null;\n  });\n  if (!context) {\n    throw new Error('useApp must be used within an AppContext');\n  }\n  return context;\n};\n"],"mappings":"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"}
+{"version":3,"file":"context-app-CxNgCfd2.js","names":[],"sources":["../src/contexts/context-app/context.styles.ts","../src/contexts/context-app/context.tsx","../src/contexts/context-app/context.hooks.ts"],"sourcesContent":["import { CSS_VARS, IThemePalette } from '@local/styles/utils';\n\nimport { CSSProperties } from 'react';\n\nimport { IAppProviderOutletStyled } from './context.types';\n\ntype IAppOutletParts = IAppProviderOutletStyled;\n\nconst toPx = (value?: number | string | null) => (typeof value === 'number' ? `${value}px` : (value ?? '0px'));\n\nconst generateGridTemplateAreas = (props: IAppOutletParts) => {\n  return `\n    \"notification notification notification\"\n    \"${props.leftAside?.isTopHeader ? 'leftAside' : 'header'} header ${props.rightAside?.isTopHeader ? 'rightAside' : 'header'}\"\n    \"${props.leftAside?.isTopHeader ? 'leftAside' : props.leftAside?.isTopNav ? 'leftAside' : 'nav'} nav ${props.rightAside?.isTopHeader ? 'rightAside' : props.rightAside?.isTopNav ? 'rightAside' : 'nav'}\"\n    \"leftAside children rightAside\"\n    \"${props.leftAside?.isTopFooter ? 'leftAside' : 'footer'} footer ${props.rightAside?.isTopFooter ? 'rightAside' : 'footer'}\"\n  `;\n};\n\nexport const getProviderAppWrapperStyle = (bgColor: IThemePalette, bgImage: string | null): CSSProperties => ({\n  backgroundColor: CSS_VARS.palette[bgColor],\n  backgroundImage: bgImage ? `url(${bgImage})` : undefined,\n  backgroundSize: 'cover',\n  backgroundPosition: 'center',\n  backgroundRepeat: 'no-repeat',\n});\n\nexport const getProviderAppOutletStyle = (props: IAppOutletParts): CSSProperties => ({\n  gridTemplateAreas: generateGridTemplateAreas(props),\n  gridTemplateColumns: `${toPx(props.leftAside?.length)} 1fr ${toPx(props.rightAside?.length)}`,\n  gridTemplateRows: `${toPx(props.notification?.length)} ${toPx(props.header?.length)} ${toPx(props.nav?.length)} 1fr ${toPx(props.footer?.length)}`,\n});\n\nexport const getProviderAppOutletChildrenStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.main?.zIndex ?? 'auto',\n  overflow: props.isScrollOutlet ? 'auto' : 'visible',\n});\n\nexport const getProviderAppOutletNotificationStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.notification?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletHeaderStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.header?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletFooterStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.footer?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletNavStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.nav?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletLeftAsideStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.leftAside?.zIndex ?? 'auto',\n});\n\nexport const getProviderAppOutletRightAsideStyle = (props: IAppOutletParts): CSSProperties => ({\n  zIndex: props.rightAside?.zIndex ?? 'auto',\n});\n","import { IPreviewAdditional, Preview } from '@local/areas/preview';\nimport { useScreenWidth } from '@local/contexts/context-screen-width';\nimport { CSS_CLASS, CSS_VARS, IThemePalette } from '@local/styles/utils';\nimport { setClasses } from '@local/styles/utils/functions';\n\nimport { FC, useCallback, useEffect, useMemo, useState } from 'react';\nimport { createContext } from 'use-context-selector';\n\nimport {\n  getProviderAppOutletChildrenStyle,\n  getProviderAppOutletFooterStyle,\n  getProviderAppOutletHeaderStyle,\n  getProviderAppOutletLeftAsideStyle,\n  getProviderAppOutletNavStyle,\n  getProviderAppOutletNotificationStyle,\n  getProviderAppOutletRightAsideStyle,\n  getProviderAppOutletStyle,\n  getProviderAppWrapperStyle,\n} from './context.styles';\nimport { IAppContext, IAppProvider, IAppProviderElement, IAppProviderOutletStyled } from './context.types';\n\nexport const AppContext = createContext<IAppContext | null>(null);\n\nexport const ProviderApp: FC<IAppProvider> = (props) => {\n  const { bgColor, changeBgColor, historyBgColor, setDefaultBgColor } = useBgColor(props.defaultBgColor);\n  const { statusBarColor, changeStatusBarColor, historyStatusBarColor, setDefaultStatusBarColor } = useStatusBarColor(\n    props.defaultStatusBarColor,\n  );\n  const { bgImage, changeBgImage, historyBgImage, setDefaultBgImage } = useBgImage(props.defaultBgImage || null);\n  const { title, changeTitle, setHistoryTitle, setDefaultTitle } = useTitle(props.defaultTitle || null);\n  const { description, changeDescription, historyDescription, setDefaultDescription } = useDescription(\n    props.defaultDescription,\n  );\n  const { changePreview, previewProps } = usePreview(props.defaultPreview);\n\n  const { breakpoint, type, orientation } = useScreenWidth(['breakpoint', 'type', 'orientation']);\n\n  const getValueByBreakpoint = useCallback(\n    (lengthByBreakpoint: IAppProviderElement['length']) => {\n      if (!lengthByBreakpoint) return null;\n      if (type === 'orientation' && lengthByBreakpoint.orientation) {\n        const value = lengthByBreakpoint.orientation?.[orientation];\n        return value ?? null;\n      }\n      if (lengthByBreakpoint.breakpoint && lengthByBreakpoint.breakpoint) {\n        if (breakpoint === 'default') return lengthByBreakpoint.default ?? null;\n        const value = lengthByBreakpoint.breakpoint?.[breakpoint];\n        return value ?? null;\n      }\n    },\n    [breakpoint, orientation, type],\n  );\n\n  const outletStyledProps: IAppProviderOutletStyled = useMemo(\n    () => ({\n      isScrollOutlet: props.isScrollOutlet,\n      main: props.main,\n      notification: props.notification\n        ? {\n            component: props.notification.component,\n            length: getValueByBreakpoint(props.notification.length),\n            zIndex: props.notification.zIndex,\n          }\n        : undefined,\n      header: props.header\n        ? {\n            component: props.header.component,\n            length: getValueByBreakpoint(props.header.length),\n            zIndex: props.header.zIndex,\n          }\n        : undefined,\n      nav: props.nav\n        ? {\n            component: props.nav.component,\n            length: getValueByBreakpoint(props.nav.length),\n            zIndex: props.nav.zIndex,\n          }\n        : undefined,\n      footer: props.footer\n        ? {\n            component: props.footer.component,\n            length: getValueByBreakpoint(props.footer.length),\n            zIndex: props.footer.zIndex,\n          }\n        : undefined,\n      leftAside: props.leftAside\n        ? {\n            component: props.leftAside.component,\n            length: getValueByBreakpoint(props.leftAside.length),\n            zIndex: props.leftAside.zIndex,\n            isTopHeader: props.leftAside.isTopHeader,\n            isTopFooter: props.leftAside.isTopFooter,\n            isTopNav: props.leftAside.isTopNav,\n          }\n        : undefined,\n      rightAside: props.rightAside\n        ? {\n            component: props.rightAside.component,\n            length: getValueByBreakpoint(props.rightAside.length),\n            zIndex: props.rightAside.zIndex,\n            isTopHeader: props.rightAside.isTopHeader,\n            isTopFooter: props.rightAside.isTopFooter,\n            isTopNav: props.rightAside.isTopNav,\n          }\n        : undefined,\n    }),\n    [\n      props.footer,\n      props.header,\n      props.leftAside,\n      props.main,\n      props.nav,\n      props.notification,\n      props.rightAside,\n      props.isScrollOutlet,\n      getValueByBreakpoint,\n    ],\n  );\n\n  return (\n    <AppContext.Provider\n      value={{\n        changePreview,\n        changeStatusBarColor,\n        changeBgColor,\n        changeBgImage,\n        changeTitle,\n        changeDescription,\n        historyStatusBarColor,\n        historyBgColor,\n        historyBgImage,\n        setHistoryTitle,\n        historyDescription,\n        setDefaultStatusBarColor,\n        setDefaultBgColor,\n        setDefaultBgImage,\n        setDefaultTitle,\n        setDefaultDescription,\n      }}\n    >\n      <title>{title}</title>\n      <meta name='description' content={description} />\n      <meta name='theme-color' content={CSS_VARS.palette[statusBarColor]} />\n      <meta name='apple-mobile-web-app-status-bar-style' content='default' />\n      <meta name='mobile-web-app-capable' content='yes' />\n      <Preview {...previewProps}>\n        <div className={CSS_CLASS.context.app.wrapper} style={getProviderAppWrapperStyle(bgColor, bgImage)}>\n          <div\n            className={setClasses([CSS_CLASS.context.app.outlet, CSS_CLASS.transition.grid])}\n            style={getProviderAppOutletStyle(outletStyledProps)}\n          >\n            {outletStyledProps.notification?.length ? (\n              <section\n                className={CSS_CLASS.context.app.outletNotification}\n                style={getProviderAppOutletNotificationStyle(outletStyledProps)}\n              >\n                {props.notification?.component || null}\n              </section>\n            ) : null}\n\n            {outletStyledProps.header?.length ? (\n              <header\n                className={CSS_CLASS.context.app.outletHeader}\n                style={getProviderAppOutletHeaderStyle(outletStyledProps)}\n              >\n                {props.header?.component || null}\n              </header>\n            ) : null}\n\n            {outletStyledProps.nav?.length ? (\n              <nav className={CSS_CLASS.context.app.outletNav} style={getProviderAppOutletNavStyle(outletStyledProps)}>\n                {props.nav?.component || null}\n              </nav>\n            ) : null}\n\n            {outletStyledProps.leftAside?.length ? (\n              <aside\n                className={CSS_CLASS.context.app.outletLeftAside}\n                style={getProviderAppOutletLeftAsideStyle(outletStyledProps)}\n              >\n                {props.leftAside?.component || null}\n              </aside>\n            ) : null}\n\n            <main\n              className={CSS_CLASS.context.app.outletChildren}\n              style={getProviderAppOutletChildrenStyle(outletStyledProps)}\n            >\n              {props.children}\n            </main>\n\n            {outletStyledProps.rightAside?.length ? (\n              <aside\n                className={CSS_CLASS.context.app.outletRightAside}\n                style={getProviderAppOutletRightAsideStyle(outletStyledProps)}\n              >\n                {props.rightAside?.component || null}\n              </aside>\n            ) : null}\n\n            {outletStyledProps.footer?.length ? (\n              <footer\n                className={CSS_CLASS.context.app.outletFooter}\n                style={getProviderAppOutletFooterStyle(outletStyledProps)}\n              >\n                {props.footer?.component || null}\n              </footer>\n            ) : null}\n          </div>\n        </div>\n      </Preview>\n    </AppContext.Provider>\n  );\n};\n\n/**\n * Custom hook to manage preview properties.\n */\nconst usePreview = (defaultPreview: IAppProvider['defaultPreview']) => {\n  const [previewProps, setIPreview] = useState(defaultPreview || { visible: true, defaultVisible: true });\n\n  const changePreview = useCallback((newIPreview: IPreviewAdditional) => {\n    setIPreview(newIPreview);\n  }, []);\n\n  useEffect(() => {\n    if (defaultPreview) setIPreview(defaultPreview);\n  }, [defaultPreview]);\n\n  return { previewProps, changePreview };\n};\n\n/**\n * Custom hook to manage background color state with history tracking.\n */\ntype BgColorState = {\n  bgColor: IThemePalette;\n  bgColorHistory: IThemePalette[];\n  bgColorIndex: number;\n};\n\nexport const useBgColor = (defaultColor: IThemePalette) => {\n  const [state, setState] = useState<BgColorState>({\n    bgColor: defaultColor,\n    bgColorHistory: [defaultColor],\n    bgColorIndex: 0,\n  });\n\n  const changeBgColor = useCallback((color: IThemePalette) => {\n    setState((prev) => {\n      const newHistory = [...prev.bgColorHistory.slice(0, prev.bgColorIndex + 1), color];\n      return {\n        bgColor: color,\n        bgColorHistory: newHistory,\n        bgColorIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const historyBgColor = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.bgColorIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.bgColorHistory.length) {\n        return {\n          ...prev,\n          bgColor: prev.bgColorHistory[newIndex],\n          bgColorIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultBgColor = useCallback(() => {\n    setState({\n      bgColor: defaultColor,\n      bgColorHistory: [defaultColor],\n      bgColorIndex: 0,\n    });\n  }, [defaultColor]);\n\n  useEffect(() => {\n    setState({\n      bgColor: defaultColor,\n      bgColorHistory: [defaultColor],\n      bgColorIndex: 0,\n    });\n  }, [defaultColor]);\n\n  return {\n    bgColor: state.bgColor,\n    changeBgColor,\n    historyBgColor,\n    setDefaultBgColor,\n    bgColorIndex: state.bgColorIndex,\n  };\n};\n\n/**\n * Custom hook to manage the status bar color with history tracking.\n */\ntype StatusBarColorState = {\n  statusBarColor: IThemePalette;\n  statusBarColorHistory: IThemePalette[];\n  statusBarColorIndex: number;\n};\n\nexport const useStatusBarColor = (defaultColor: IThemePalette) => {\n  const [state, setState] = useState<StatusBarColorState>({\n    statusBarColor: defaultColor,\n    statusBarColorHistory: [defaultColor],\n    statusBarColorIndex: 0,\n  });\n\n  const changeStatusBarColor = useCallback((color: IThemePalette) => {\n    setState((prev) => {\n      const newHistory = [...prev.statusBarColorHistory.slice(0, prev.statusBarColorIndex + 1), color];\n      return {\n        statusBarColor: color,\n        statusBarColorHistory: newHistory,\n        statusBarColorIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const historyStatusBarColor = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.statusBarColorIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.statusBarColorHistory.length) {\n        return {\n          ...prev,\n          statusBarColor: prev.statusBarColorHistory[newIndex],\n          statusBarColorIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultStatusBarColor = useCallback(() => {\n    setState({\n      statusBarColor: defaultColor,\n      statusBarColorHistory: [defaultColor],\n      statusBarColorIndex: 0,\n    });\n  }, [defaultColor]);\n\n  useEffect(() => {\n    setState({\n      statusBarColor: defaultColor,\n      statusBarColorHistory: [defaultColor],\n      statusBarColorIndex: 0,\n    });\n  }, [defaultColor]);\n\n  return {\n    statusBarColor: state.statusBarColor,\n    changeStatusBarColor,\n    historyStatusBarColor,\n    setDefaultStatusBarColor,\n    statusBarColorIndex: state.statusBarColorIndex,\n  };\n};\n\n/**\n * Custom hook to manage background images with history.\n */\ntype BgImageState = {\n  bgImage: string | null;\n  bgImageHistory: (string | null)[];\n  bgImageIndex: number;\n};\n\nexport const useBgImage = (defaultImage: string | null) => {\n  const [state, setState] = useState<BgImageState>({\n    bgImage: defaultImage,\n    bgImageHistory: [defaultImage],\n    bgImageIndex: 0,\n  });\n\n  const changeBgImage = useCallback((image: string | null) => {\n    setState((prev) => {\n      const newHistory = [...prev.bgImageHistory.slice(0, prev.bgImageIndex + 1), image];\n      return {\n        bgImage: image,\n        bgImageHistory: newHistory,\n        bgImageIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const historyBgImage = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.bgImageIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.bgImageHistory.length) {\n        return {\n          ...prev,\n          bgImage: prev.bgImageHistory[newIndex],\n          bgImageIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultBgImage = useCallback(() => {\n    setState({\n      bgImage: defaultImage,\n      bgImageHistory: [defaultImage],\n      bgImageIndex: 0,\n    });\n  }, [defaultImage]);\n\n  useEffect(() => {\n    setState({\n      bgImage: defaultImage,\n      bgImageHistory: [defaultImage],\n      bgImageIndex: 0,\n    });\n  }, [defaultImage]);\n\n  return {\n    bgImage: state.bgImage,\n    changeBgImage,\n    historyBgImage,\n    setDefaultBgImage,\n    bgImageIndex: state.bgImageIndex,\n  };\n};\n\ntype TitleState = {\n  title: string | null;\n  titleHistory: (string | null)[];\n  titleIndex: number;\n};\n/**\n * Custom hook to manage the document title with history tracking.\n */\nconst useTitle = (defaultTitle: string | null) => {\n  const [state, setState] = useState<TitleState>({\n    title: defaultTitle,\n    titleHistory: [defaultTitle],\n    titleIndex: 0,\n  });\n\n  const changeTitle = useCallback((newTitle: string | null) => {\n    setState((prev) => {\n      const newHistory = [...prev.titleHistory.slice(0, prev.titleIndex + 1), newTitle];\n      return {\n        title: newTitle,\n        titleHistory: newHistory,\n        titleIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const setHistoryTitle = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.titleIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.titleHistory.length) {\n        return {\n          ...prev,\n          title: prev.titleHistory[newIndex],\n          titleIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultTitle = useCallback(() => {\n    setState({\n      title: defaultTitle,\n      titleHistory: [defaultTitle],\n      titleIndex: 0,\n    });\n  }, [defaultTitle]);\n\n  useEffect(() => {\n    setState({\n      title: defaultTitle,\n      titleHistory: [defaultTitle],\n      titleIndex: 0,\n    });\n  }, [defaultTitle]);\n\n  return {\n    title: state.title,\n    titleIndex: state.titleIndex,\n    titleHistory: state.titleHistory,\n    changeTitle,\n    setHistoryTitle,\n    setDefaultTitle,\n  };\n};\n\n/**\n * Custom hook to manage a description with history tracking.\n */\ntype DescriptionState = {\n  description: string;\n  descriptionHistory: string[];\n  descriptionIndex: number;\n};\n\nexport const useDescription = (defaultDescription: string) => {\n  const [state, setState] = useState<DescriptionState>({\n    description: defaultDescription,\n    descriptionHistory: [defaultDescription],\n    descriptionIndex: 0,\n  });\n\n  const changeDescription = useCallback((newDescription: string) => {\n    setState((prev) => {\n      const newHistory = [...prev.descriptionHistory.slice(0, prev.descriptionIndex + 1), newDescription];\n      return {\n        description: newDescription,\n        descriptionHistory: newHistory,\n        descriptionIndex: newHistory.length - 1,\n      };\n    });\n  }, []);\n\n  const historyDescription = useCallback((steps: number) => {\n    setState((prev) => {\n      const newIndex = prev.descriptionIndex + steps;\n      if (newIndex >= 0 && newIndex < prev.descriptionHistory.length) {\n        return {\n          ...prev,\n          description: prev.descriptionHistory[newIndex],\n          descriptionIndex: newIndex,\n        };\n      }\n      return prev;\n    });\n  }, []);\n\n  const setDefaultDescription = useCallback(() => {\n    setState({\n      description: defaultDescription,\n      descriptionHistory: [defaultDescription],\n      descriptionIndex: 0,\n    });\n  }, [defaultDescription]);\n\n  useEffect(() => {\n    setState({\n      description: defaultDescription,\n      descriptionHistory: [defaultDescription],\n      descriptionIndex: 0,\n    });\n  }, [defaultDescription]);\n\n  return {\n    description: state.description,\n    changeDescription,\n    historyDescription,\n    setDefaultDescription,\n    descriptionIndex: state.descriptionIndex,\n  };\n};\n","import { useContextSelector } from 'use-context-selector';\n\nimport { AppContext } from './context';\nimport { IAppContext, IUseAppDependencies } from './context.types';\n\nexport const useApp = (props: IUseAppDependencies): IAppContext => {\n  const context = useContextSelector(AppContext, (v) => {\n    return v\n      ? props.reduce((acc, prop) => {\n          acc[prop] = v[prop];\n          return acc;\n        }, {} as any)\n      : null;\n  });\n  if (!context) {\n    throw new Error('useApp must be used within an AppContext');\n  }\n  return context;\n};\n"],"mappings":"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"}

package/build/context-app.cjs.js

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./chunk-Dd8m0Ver.cjs"),e=require("./context-app-Dsa1tKlU.cjs");exports.ProviderApp=e.ProviderApp;exports.useApp=e.useApp;
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./chunk-Dd8m0Ver.cjs"),e=require("./context-app-29ajupjq.cjs");exports.ProviderApp=e.ProviderApp;exports.useApp=e.useApp;

package/build/context-app.es.js

@@ -1,4 +1,4 @@
-import { n as r, t as o } from "./context-app-C9XoarPw.js";
+import { n as r, t as o } from "./context-app-CxNgCfd2.js";
 export {
   r as ProviderApp,
   o as useApp

package/build/{context-dialog-DctdSBC8.cjs → context-dialog-BLb0fPJw.cjs}

@@ -1,3 +1,3 @@
-const U=require("./chunk-Dd8m0Ver.cjs"),v=require("./utils-DCIq-5FL.cjs"),C=require("./functions-CZrZU5U0.cjs"),f=require("./proxy-BDese6Pb.cjs"),O=require("./AnimatePresence-DeKd4Eek.cjs"),L=require("./outside-CXyCk8h1.cjs"),S=require("./hooks-use-deep-compare-memoize.cjs.js"),p=require("./dist-SXTf0-_7.cjs"),b=require("./v4-BDi_Luux.cjs");let x=require("react/jsx-runtime"),t=require("react");var h="fillDarkStable",I=v.CSS_CLASS.context.dialog,q=()=>I.layout,T=e=>({backgroundColor:v.CSS_VARS.palette.fillSecondaryLightStable,zIndex:e.zIndex}),M=e=>({maxWidth:e.propsDialog?.maxWidth||"max-content",maxHeight:e.propsDialog?.maxHeight||"max-content",borderRadius:e.propsDialog?.borderRadius||"12px",background:e.propsDialog?.background?v.CSS_VARS.palette[e.propsDialog.background]:v.CSS_VARS.palette[h],padding:e.propsDialog?.padding||"20px"}),y=p.createContext(null),k=e=>{const[a,l]=(0,t.useState)([]),c=q(),d=(0,t.useCallback)(i=>{l(s=>{const u=s.find(o=>o.id===i);if(u===void 0)return s;const n=u.index;return n===void 0?s:s.filter(o=>o.id!==i).map(o=>{const _=o.index;return _===void 0?o:{...o,index:_>n?_-1:o.index}})})},[]),g=(0,t.useCallback)(i=>{l(s=>s.map(u=>u.id===i.id?{...u,...i}:u))},[]),m=(0,t.useCallback)(i=>{const s=i.id;l(u=>{const n=u.findIndex(_=>_.id===s);let o;if(n!==-1)o=[...u],o[n]={...i,id:s,index:u[n].index};else{o=u.map(E=>{const R=E.index;return R===void 0?E:{...E,index:R+1}});const _={...i,id:s,index:0};o.unshift(_)}return o})},[]),r=(0,t.useMemo)(()=>a.length,[a.length]),D=(0,t.useMemo)(()=>e.zIndex,[e.zIndex]);return(0,t.useEffect)(()=>()=>{l([])},[]),(0,x.jsxs)(y.Provider,{value:{add:m,remove:d,update:g,dialogHistory:a},children:[(0,x.jsx)(O.AnimatePresence,{children:r&&(0,x.jsx)(f.motion.div,{className:c,style:T({zIndex:D}),initial:{opacity:0},exit:{opacity:0},animate:{opacity:1},transition:{type:"spring",duration:.4},children:[...a].reverse().map(i=>(0,x.jsx)(N,{index:i.index,props:i.props,id:i.id,onRemove:i.onRemove},i.id))})}),e.children]})},P=e=>{const[a,l]=(0,t.useState)(!0),c=(0,t.useMemo)(()=>({...M({propsDialog:e.props?.propsDialog})}),[e.props?.propsDialog]),d=(0,t.useMemo)(()=>({position:"absolute",inset:0,display:"flex",alignItems:"center",justifyContent:"center",pointerEvents:e.index===0?"auto":"none"}),[e.index]),g=(0,t.useMemo)(()=>e.props?.propsDialog?.isRemoveOnOutsideClick??!0,[e.props?.propsDialog?.isRemoveOnOutsideClick]),m=(0,t.useCallback)(()=>{e.props?.onRemove?.(),e.onRemove?.()},[e.onRemove,e.props?.onRemove]),r=e.props?.content,D=(0,t.useMemo)(()=>e.id===void 0||r===void 0?null:(0,x.jsx)(r,{remove:m,isAnimating:a,propsCustom:e.props?.propsCustom,id:e.id}),[r,a,e.props?.propsCustom,m,e.id]);return e.index!==void 0&&(0,x.jsx)("div",{style:d,children:(0,x.jsx)(L.Outside,{onOutsideClick:()=>e.index===0&&g&&m?.(),children:(0,x.jsx)(f.motion.dialog,{className:C.setClasses([I.element]),initial:{opacity:0,scale:.8},animate:{opacity:1,scale:1},onAnimationComplete:()=>l(!1),transition:{type:"spring",duration:.3,delay:.4},style:c,children:D},e.id)})})},N=(0,t.memo)(P),A=e=>{const a=p.useContextSelector(y,l=>l?e.reduce((c,d)=>(c[d]=l[d],c),{}):null);if(!a)throw new Error("useDialogs must be used within an DialogContext");return a},j=e=>{const{add:a,remove:l,update:c,dialogHistory:d}=A(["add","remove","update","dialogHistory"]),[g,m]=(0,t.useState)(null),r=(0,t.useRef)(null),D=S.useDeepCompareMemoize(e),i=(0,t.useMemo)(()=>g!==null&&d.some(n=>n.id===g),[d,g]),s=(0,t.useCallback)(()=>{const n=r.current;n&&(m(null),r.current=null,l(n))},[l]),u=(0,t.useCallback)(()=>{if(r.current)return;const n=b.v4();m(n),r.current=n,a({id:n,props:D,onRemove:()=>{s(),D?.onRemove?.()}})},[a,D,s]);return(0,t.useEffect)(()=>{const n=r.current;n&&(d.some(o=>o.id===n)||(m(null),r.current=null))},[d]),(0,t.useEffect)(()=>{r.current&&c({id:r.current,props:D})},[D,c]),{add:u,remove:s,id:g,isOpen:i}};Object.defineProperty(exports,"ProviderDialog",{enumerable:!0,get:function(){return k}});Object.defineProperty(exports,"useDialog",{enumerable:!0,get:function(){return j}});Object.defineProperty(exports,"useDialogs",{enumerable:!0,get:function(){return A}});
+const U=require("./chunk-Dd8m0Ver.cjs"),v=require("./utils-DCIq-5FL.cjs"),C=require("./functions-CZrZU5U0.cjs"),f=require("./proxy-BDese6Pb.cjs"),O=require("./AnimatePresence-DeKd4Eek.cjs"),L=require("./outside-BP81eKu0.cjs"),S=require("./hooks-use-deep-compare-memoize.cjs.js"),p=require("./dist-SXTf0-_7.cjs"),b=require("./v4-BDi_Luux.cjs");let x=require("react/jsx-runtime"),t=require("react");var h="fillDarkStable",I=v.CSS_CLASS.context.dialog,q=()=>I.layout,T=e=>({backgroundColor:v.CSS_VARS.palette.fillSecondaryLightStable,zIndex:e.zIndex}),M=e=>({maxWidth:e.propsDialog?.maxWidth||"max-content",maxHeight:e.propsDialog?.maxHeight||"max-content",borderRadius:e.propsDialog?.borderRadius||"12px",background:e.propsDialog?.background?v.CSS_VARS.palette[e.propsDialog.background]:v.CSS_VARS.palette[h],padding:e.propsDialog?.padding||"20px"}),y=p.createContext(null),k=e=>{const[a,l]=(0,t.useState)([]),c=q(),d=(0,t.useCallback)(i=>{l(s=>{const u=s.find(o=>o.id===i);if(u===void 0)return s;const n=u.index;return n===void 0?s:s.filter(o=>o.id!==i).map(o=>{const _=o.index;return _===void 0?o:{...o,index:_>n?_-1:o.index}})})},[]),g=(0,t.useCallback)(i=>{l(s=>s.map(u=>u.id===i.id?{...u,...i}:u))},[]),m=(0,t.useCallback)(i=>{const s=i.id;l(u=>{const n=u.findIndex(_=>_.id===s);let o;if(n!==-1)o=[...u],o[n]={...i,id:s,index:u[n].index};else{o=u.map(E=>{const R=E.index;return R===void 0?E:{...E,index:R+1}});const _={...i,id:s,index:0};o.unshift(_)}return o})},[]),r=(0,t.useMemo)(()=>a.length,[a.length]),D=(0,t.useMemo)(()=>e.zIndex,[e.zIndex]);return(0,t.useEffect)(()=>()=>{l([])},[]),(0,x.jsxs)(y.Provider,{value:{add:m,remove:d,update:g,dialogHistory:a},children:[(0,x.jsx)(O.AnimatePresence,{children:r&&(0,x.jsx)(f.motion.div,{className:c,style:T({zIndex:D}),initial:{opacity:0},exit:{opacity:0},animate:{opacity:1},transition:{type:"spring",duration:.4},children:[...a].reverse().map(i=>(0,x.jsx)(N,{index:i.index,props:i.props,id:i.id,onRemove:i.onRemove},i.id))})}),e.children]})},P=e=>{const[a,l]=(0,t.useState)(!0),c=(0,t.useMemo)(()=>({...M({propsDialog:e.props?.propsDialog})}),[e.props?.propsDialog]),d=(0,t.useMemo)(()=>({position:"absolute",inset:0,display:"flex",alignItems:"center",justifyContent:"center",pointerEvents:e.index===0?"auto":"none"}),[e.index]),g=(0,t.useMemo)(()=>e.props?.propsDialog?.isRemoveOnOutsideClick??!0,[e.props?.propsDialog?.isRemoveOnOutsideClick]),m=(0,t.useCallback)(()=>{e.props?.onRemove?.(),e.onRemove?.()},[e.onRemove,e.props?.onRemove]),r=e.props?.content,D=(0,t.useMemo)(()=>e.id===void 0||r===void 0?null:(0,x.jsx)(r,{remove:m,isAnimating:a,propsCustom:e.props?.propsCustom,id:e.id}),[r,a,e.props?.propsCustom,m,e.id]);return e.index!==void 0&&(0,x.jsx)("div",{style:d,children:(0,x.jsx)(L.Outside,{onOutsideClick:()=>e.index===0&&g&&m?.(),children:(0,x.jsx)(f.motion.dialog,{className:C.setClasses([I.element]),initial:{opacity:0,scale:.8},animate:{opacity:1,scale:1},onAnimationComplete:()=>l(!1),transition:{type:"spring",duration:.3,delay:.4},style:c,children:D},e.id)})})},N=(0,t.memo)(P),A=e=>{const a=p.useContextSelector(y,l=>l?e.reduce((c,d)=>(c[d]=l[d],c),{}):null);if(!a)throw new Error("useDialogs must be used within an DialogContext");return a},j=e=>{const{add:a,remove:l,update:c,dialogHistory:d}=A(["add","remove","update","dialogHistory"]),[g,m]=(0,t.useState)(null),r=(0,t.useRef)(null),D=S.useDeepCompareMemoize(e),i=(0,t.useMemo)(()=>g!==null&&d.some(n=>n.id===g),[d,g]),s=(0,t.useCallback)(()=>{const n=r.current;n&&(m(null),r.current=null,l(n))},[l]),u=(0,t.useCallback)(()=>{if(r.current)return;const n=b.v4();m(n),r.current=n,a({id:n,props:D,onRemove:()=>{s(),D?.onRemove?.()}})},[a,D,s]);return(0,t.useEffect)(()=>{const n=r.current;n&&(d.some(o=>o.id===n)||(m(null),r.current=null))},[d]),(0,t.useEffect)(()=>{r.current&&c({id:r.current,props:D})},[D,c]),{add:u,remove:s,id:g,isOpen:i}};Object.defineProperty(exports,"ProviderDialog",{enumerable:!0,get:function(){return k}});Object.defineProperty(exports,"useDialog",{enumerable:!0,get:function(){return j}});Object.defineProperty(exports,"useDialogs",{enumerable:!0,get:function(){return A}});
 
-//# sourceMappingURL=context-dialog-DctdSBC8.cjs.map
+//# sourceMappingURL=context-dialog-BLb0fPJw.cjs.map

package/build/{context-dialog-DctdSBC8.cjs.map → context-dialog-BLb0fPJw.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"context-dialog-DctdSBC8.cjs","names":[],"sources":["../src/contexts/context-dialog/context.constants.ts","../src/contexts/context-dialog/context.styles.tsx","../src/contexts/context-dialog/context.tsx","../src/contexts/context-dialog/context.hooks.ts"],"sourcesContent":["import { IThemePalette } from '@local/styles/utils';\n\nexport const DEFAULT_PROVIDER_DIALOG_DURATION_ELEMENT = 0.3;\nexport const DEFAULT_PROVIDER_DIALOG_DURATION_LAYOUT = 0.4;\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_HEIGHT: string = 'max-content';\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_WIDTH: string = 'max-content';\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_BORDER_RADIUS: string = '12px';\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_PADDING: string = '20px';\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_BACKGROUND: IThemePalette = 'fillDarkStable';\n","import { CSS_CLASS, CSS_VARS } from '@local/styles/utils';\n\nimport { CSSProperties } from 'react';\n\nimport {\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_BACKGROUND,\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_BORDER_RADIUS,\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_HEIGHT,\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_WIDTH,\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_PADDING,\n} from './context.constants';\nimport { IDialogElementStyle, IDialogLayoutStyle } from './context.types';\n\nexport const DialogClass = CSS_CLASS.context.dialog;\n\nexport const getDialogLayoutClassName = () => DialogClass.layout;\n\nexport const getDialogLayoutStyle = (props: IDialogLayoutStyle): CSSProperties => ({\n  backgroundColor: CSS_VARS.palette.fillSecondaryLightStable,\n  zIndex: props.zIndex,\n});\n\nexport const getDialogElementStyle = (props: IDialogElementStyle): CSSProperties => ({\n  maxWidth: props.propsDialog?.maxWidth || DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_WIDTH,\n  maxHeight: props.propsDialog?.maxHeight || DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_HEIGHT,\n  borderRadius: props.propsDialog?.borderRadius || DEFAULT_PROVIDER_DIALOG_ELEMENT_BORDER_RADIUS,\n  background: props.propsDialog?.background\n    ? CSS_VARS.palette[props.propsDialog.background]\n    : CSS_VARS.palette[DEFAULT_PROVIDER_DIALOG_ELEMENT_BACKGROUND],\n  padding: props.propsDialog?.padding || DEFAULT_PROVIDER_DIALOG_ELEMENT_PADDING,\n});\n","import { Outside } from '@local/areas/outside';\nimport { setClasses } from '@local/styles/utils/functions';\n\nimport { AnimatePresence, motion } from 'framer-motion';\nimport { CSSProperties, FC, memo, useCallback, useEffect, useMemo, useState } from 'react';\nimport { createContext } from 'use-context-selector';\n\nimport { DEFAULT_PROVIDER_DIALOG_DURATION_ELEMENT, DEFAULT_PROVIDER_DIALOG_DURATION_LAYOUT } from './context.constants';\nimport { DialogClass, getDialogElementStyle, getDialogLayoutClassName, getDialogLayoutStyle } from './context.styles';\nimport { IDialogContent, IDialogContext, IDialogElement, IDialogProvider } from './context.types';\n\nexport const DialogContext = createContext<IDialogContext | null>(null);\n\nexport const ProviderDialog: FC<IDialogProvider> = (props) => {\n  const [dialogHistory, setDialogHistory] = useState<IDialogContent[]>([]);\n  const classNameDialogLayout = getDialogLayoutClassName();\n\n  const remove: IDialogContext['remove'] = useCallback((id) => {\n    setDialogHistory((prev) => {\n      const itemToRemove = prev.find((item) => item.id === id);\n\n      if (itemToRemove === undefined) return prev;\n\n      const indexToRemove = itemToRemove.index;\n\n      if (indexToRemove === undefined) return prev;\n\n      const updatedHistory = prev\n        .filter((item) => item.id !== id)\n        .map((item) => {\n          const index = item.index;\n          if (index === undefined) return item;\n\n          return {\n            ...item,\n            index: index > indexToRemove ? index - 1 : item.index,\n          };\n        });\n\n      return updatedHistory;\n    });\n  }, []);\n\n  const update: IDialogContext['update'] = useCallback((dialog) => {\n    setDialogHistory((prev) => {\n      return prev.map((item) => {\n        if (item.id === dialog.id) {\n          return { ...item, ...dialog };\n        }\n        return item;\n      });\n    });\n  }, []);\n\n  const add: IDialogContext['add'] = useCallback((dialog) => {\n    const id = dialog.id;\n\n    setDialogHistory((prev) => {\n      const existingIndex = prev.findIndex((item) => item.id === id);\n\n      let updatedHistory: IDialogContent[];\n\n      if (existingIndex !== -1) {\n        updatedHistory = [...prev];\n        updatedHistory[existingIndex] = { ...dialog, id, index: prev[existingIndex].index };\n      } else {\n        updatedHistory = prev.map((item) => {\n          const index = item.index;\n          if (index === undefined) return item;\n\n          return {\n            ...item,\n            index: index + 1,\n          };\n        });\n        const newContent = { ...dialog, id, index: 0 };\n        updatedHistory.unshift(newContent);\n      }\n\n      return updatedHistory;\n    });\n  }, []);\n\n  const dialogHistoryLength = useMemo(() => dialogHistory.length, [dialogHistory.length]);\n  const zIndex = useMemo(() => props.zIndex, [props.zIndex]);\n\n  useEffect(() => {\n    return () => {\n      setDialogHistory([]);\n    };\n  }, []);\n  return (\n    <DialogContext.Provider value={{ add, remove, update, dialogHistory }}>\n      <AnimatePresence>\n        {dialogHistoryLength && (\n          <motion.div\n            className={classNameDialogLayout}\n            style={getDialogLayoutStyle({ zIndex })}\n            initial={{\n              opacity: 0,\n            }}\n            exit={{\n              opacity: 0,\n            }}\n            animate={{\n              opacity: 1,\n            }}\n            transition={{ type: 'spring', duration: DEFAULT_PROVIDER_DIALOG_DURATION_LAYOUT }}\n          >\n            {[...dialogHistory].reverse().map((dialog) => {\n              return (\n                <MemoizedDialogElement\n                  key={dialog.id}\n                  index={dialog.index}\n                  props={dialog.props}\n                  id={dialog.id}\n                  onRemove={dialog.onRemove}\n                />\n              );\n            })}\n          </motion.div>\n        )}\n      </AnimatePresence>\n\n      {props.children}\n    </DialogContext.Provider>\n  );\n};\n\nconst DialogElement = (props: IDialogElement<Record<string, unknown>>) => {\n  const [isAnimating, setIsAnimating] = useState(true);\n  const styleDialogElement = useMemo(() => {\n    return {\n      ...getDialogElementStyle({\n        propsDialog: props.props?.propsDialog,\n      }),\n    };\n  }, [props.props?.propsDialog]);\n  const styleDialogLayer = useMemo<CSSProperties>(() => {\n    return {\n      position: 'absolute',\n      inset: 0,\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      pointerEvents: props.index === 0 ? 'auto' : 'none',\n    };\n  }, [props.index]);\n\n  const isRemoveOnOutsideClick = useMemo(\n    () => props.props?.propsDialog?.isRemoveOnOutsideClick ?? true,\n    [props.props?.propsDialog?.isRemoveOnOutsideClick],\n  );\n  const onRemove = useCallback(() => {\n    props.props?.onRemove?.();\n    props.onRemove?.();\n  }, [props.onRemove, props.props?.onRemove]);\n\n  const Content = props.props?.content;\n  const children = useMemo(() => {\n    if (props.id === undefined || Content === undefined) return null;\n\n    return <Content remove={onRemove} isAnimating={isAnimating} propsCustom={props.props?.propsCustom} id={props.id} />;\n  }, [Content, isAnimating, props.props?.propsCustom, onRemove, props.id]);\n  return (\n    props.index !== undefined && (\n      <div style={styleDialogLayer}>\n        <Outside onOutsideClick={() => props.index === 0 && isRemoveOnOutsideClick && onRemove?.()}>\n          <motion.dialog\n            key={props.id}\n            className={setClasses([DialogClass.element])}\n            initial={{\n              opacity: 0,\n              scale: 0.8,\n            }}\n            animate={{\n              opacity: 1,\n              scale: 1,\n            }}\n            onAnimationComplete={() => setIsAnimating(false)}\n            transition={{\n              type: 'spring',\n              duration: DEFAULT_PROVIDER_DIALOG_DURATION_ELEMENT,\n              delay: DEFAULT_PROVIDER_DIALOG_DURATION_LAYOUT,\n            }}\n            style={styleDialogElement}\n          >\n            {children}\n          </motion.dialog>\n        </Outside>\n      </div>\n    )\n  );\n};\nconst MemoizedDialogElement = memo(DialogElement);\n","import { useDeepCompareMemoize } from '@local/hooks/use-deep-compare-memoize';\n\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useContextSelector } from 'use-context-selector';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { DialogContext } from './context';\nimport { IDialogContext, IDialogItem, IUseDialog, IUseDialogDependencies } from './context.types';\n\nexport const useDialogs = (props: IUseDialogDependencies): IDialogContext => {\n  const context = useContextSelector(DialogContext, (v) => {\n    return v\n      ? props.reduce((acc, prop) => {\n          acc[prop] = v[prop];\n          return acc;\n        }, {} as any)\n      : null;\n  });\n  if (!context) {\n    throw new Error('useDialogs must be used within an DialogContext');\n  }\n  return context;\n};\n\nexport const useDialog = <T extends object = Record<string, unknown>>(props?: IUseDialog<T>): IDialogItem => {\n  const { add, remove, update, dialogHistory } = useDialogs(['add', 'remove', 'update', 'dialogHistory']);\n  const [id, setId] = useState<string | null>(null);\n  const refId = useRef<string | null>(null);\n  const propsMemo = useDeepCompareMemoize(props);\n  const isOpen = useMemo(() => {\n    return id !== null && dialogHistory.some((dialog) => dialog.id === id);\n  }, [dialogHistory, id]);\n\n  const localRemove = useCallback(() => {\n    const dialogId = refId.current;\n\n    if (!dialogId) return;\n\n    setId(null);\n    refId.current = null;\n    remove(dialogId);\n  }, [remove]);\n\n  const localAdd: IDialogItem['add'] = useCallback(() => {\n    if (refId.current) return;\n    const dialogId = uuidv4();\n    setId(dialogId);\n    refId.current = dialogId;\n    add({\n      id: dialogId,\n      props: propsMemo as IUseDialog<Record<string, unknown>>,\n      onRemove: () => {\n        localRemove();\n        propsMemo?.onRemove?.();\n      },\n    });\n  }, [add, propsMemo, localRemove]);\n\n  useEffect(() => {\n    const dialogId = refId.current;\n\n    if (!dialogId) return;\n\n    if (!dialogHistory.some((dialog) => dialog.id === dialogId)) {\n      setId(null);\n      refId.current = null;\n    }\n  }, [dialogHistory]);\n\n  useEffect(() => {\n    if (refId.current) {\n      update({ id: refId.current, props: propsMemo as IUseDialog<Record<string, unknown>> });\n    }\n  }, [propsMemo, update]);\n\n  return { add: localAdd, remove: localRemove, id: id, isOpen: isOpen };\n};\n"],"mappings":"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"}
+{"version":3,"file":"context-dialog-BLb0fPJw.cjs","names":[],"sources":["../src/contexts/context-dialog/context.constants.ts","../src/contexts/context-dialog/context.styles.tsx","../src/contexts/context-dialog/context.tsx","../src/contexts/context-dialog/context.hooks.ts"],"sourcesContent":["import { IThemePalette } from '@local/styles/utils';\n\nexport const DEFAULT_PROVIDER_DIALOG_DURATION_ELEMENT = 0.3;\nexport const DEFAULT_PROVIDER_DIALOG_DURATION_LAYOUT = 0.4;\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_HEIGHT: string = 'max-content';\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_WIDTH: string = 'max-content';\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_BORDER_RADIUS: string = '12px';\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_PADDING: string = '20px';\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_BACKGROUND: IThemePalette = 'fillDarkStable';\n","import { CSS_CLASS, CSS_VARS } from '@local/styles/utils';\n\nimport { CSSProperties } from 'react';\n\nimport {\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_BACKGROUND,\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_BORDER_RADIUS,\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_HEIGHT,\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_WIDTH,\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_PADDING,\n} from './context.constants';\nimport { IDialogElementStyle, IDialogLayoutStyle } from './context.types';\n\nexport const DialogClass = CSS_CLASS.context.dialog;\n\nexport const getDialogLayoutClassName = () => DialogClass.layout;\n\nexport const getDialogLayoutStyle = (props: IDialogLayoutStyle): CSSProperties => ({\n  backgroundColor: CSS_VARS.palette.fillSecondaryLightStable,\n  zIndex: props.zIndex,\n});\n\nexport const getDialogElementStyle = (props: IDialogElementStyle): CSSProperties => ({\n  maxWidth: props.propsDialog?.maxWidth || DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_WIDTH,\n  maxHeight: props.propsDialog?.maxHeight || DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_HEIGHT,\n  borderRadius: props.propsDialog?.borderRadius || DEFAULT_PROVIDER_DIALOG_ELEMENT_BORDER_RADIUS,\n  background: props.propsDialog?.background\n    ? CSS_VARS.palette[props.propsDialog.background]\n    : CSS_VARS.palette[DEFAULT_PROVIDER_DIALOG_ELEMENT_BACKGROUND],\n  padding: props.propsDialog?.padding || DEFAULT_PROVIDER_DIALOG_ELEMENT_PADDING,\n});\n","import { Outside } from '@local/areas/outside';\nimport { setClasses } from '@local/styles/utils/functions';\n\nimport { AnimatePresence, motion } from 'framer-motion';\nimport { CSSProperties, FC, memo, useCallback, useEffect, useMemo, useState } from 'react';\nimport { createContext } from 'use-context-selector';\n\nimport { DEFAULT_PROVIDER_DIALOG_DURATION_ELEMENT, DEFAULT_PROVIDER_DIALOG_DURATION_LAYOUT } from './context.constants';\nimport { DialogClass, getDialogElementStyle, getDialogLayoutClassName, getDialogLayoutStyle } from './context.styles';\nimport { IDialogContent, IDialogContext, IDialogElement, IDialogProvider } from './context.types';\n\nexport const DialogContext = createContext<IDialogContext | null>(null);\n\nexport const ProviderDialog: FC<IDialogProvider> = (props) => {\n  const [dialogHistory, setDialogHistory] = useState<IDialogContent[]>([]);\n  const classNameDialogLayout = getDialogLayoutClassName();\n\n  const remove: IDialogContext['remove'] = useCallback((id) => {\n    setDialogHistory((prev) => {\n      const itemToRemove = prev.find((item) => item.id === id);\n\n      if (itemToRemove === undefined) return prev;\n\n      const indexToRemove = itemToRemove.index;\n\n      if (indexToRemove === undefined) return prev;\n\n      const updatedHistory = prev\n        .filter((item) => item.id !== id)\n        .map((item) => {\n          const index = item.index;\n          if (index === undefined) return item;\n\n          return {\n            ...item,\n            index: index > indexToRemove ? index - 1 : item.index,\n          };\n        });\n\n      return updatedHistory;\n    });\n  }, []);\n\n  const update: IDialogContext['update'] = useCallback((dialog) => {\n    setDialogHistory((prev) => {\n      return prev.map((item) => {\n        if (item.id === dialog.id) {\n          return { ...item, ...dialog };\n        }\n        return item;\n      });\n    });\n  }, []);\n\n  const add: IDialogContext['add'] = useCallback((dialog) => {\n    const id = dialog.id;\n\n    setDialogHistory((prev) => {\n      const existingIndex = prev.findIndex((item) => item.id === id);\n\n      let updatedHistory: IDialogContent[];\n\n      if (existingIndex !== -1) {\n        updatedHistory = [...prev];\n        updatedHistory[existingIndex] = { ...dialog, id, index: prev[existingIndex].index };\n      } else {\n        updatedHistory = prev.map((item) => {\n          const index = item.index;\n          if (index === undefined) return item;\n\n          return {\n            ...item,\n            index: index + 1,\n          };\n        });\n        const newContent = { ...dialog, id, index: 0 };\n        updatedHistory.unshift(newContent);\n      }\n\n      return updatedHistory;\n    });\n  }, []);\n\n  const dialogHistoryLength = useMemo(() => dialogHistory.length, [dialogHistory.length]);\n  const zIndex = useMemo(() => props.zIndex, [props.zIndex]);\n\n  useEffect(() => {\n    return () => {\n      setDialogHistory([]);\n    };\n  }, []);\n  return (\n    <DialogContext.Provider value={{ add, remove, update, dialogHistory }}>\n      <AnimatePresence>\n        {dialogHistoryLength && (\n          <motion.div\n            className={classNameDialogLayout}\n            style={getDialogLayoutStyle({ zIndex })}\n            initial={{\n              opacity: 0,\n            }}\n            exit={{\n              opacity: 0,\n            }}\n            animate={{\n              opacity: 1,\n            }}\n            transition={{ type: 'spring', duration: DEFAULT_PROVIDER_DIALOG_DURATION_LAYOUT }}\n          >\n            {[...dialogHistory].reverse().map((dialog) => {\n              return (\n                <MemoizedDialogElement\n                  key={dialog.id}\n                  index={dialog.index}\n                  props={dialog.props}\n                  id={dialog.id}\n                  onRemove={dialog.onRemove}\n                />\n              );\n            })}\n          </motion.div>\n        )}\n      </AnimatePresence>\n\n      {props.children}\n    </DialogContext.Provider>\n  );\n};\n\nconst DialogElement = (props: IDialogElement<Record<string, unknown>>) => {\n  const [isAnimating, setIsAnimating] = useState(true);\n  const styleDialogElement = useMemo(() => {\n    return {\n      ...getDialogElementStyle({\n        propsDialog: props.props?.propsDialog,\n      }),\n    };\n  }, [props.props?.propsDialog]);\n  const styleDialogLayer = useMemo<CSSProperties>(() => {\n    return {\n      position: 'absolute',\n      inset: 0,\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      pointerEvents: props.index === 0 ? 'auto' : 'none',\n    };\n  }, [props.index]);\n\n  const isRemoveOnOutsideClick = useMemo(\n    () => props.props?.propsDialog?.isRemoveOnOutsideClick ?? true,\n    [props.props?.propsDialog?.isRemoveOnOutsideClick],\n  );\n  const onRemove = useCallback(() => {\n    props.props?.onRemove?.();\n    props.onRemove?.();\n  }, [props.onRemove, props.props?.onRemove]);\n\n  const Content = props.props?.content;\n  const children = useMemo(() => {\n    if (props.id === undefined || Content === undefined) return null;\n\n    return <Content remove={onRemove} isAnimating={isAnimating} propsCustom={props.props?.propsCustom} id={props.id} />;\n  }, [Content, isAnimating, props.props?.propsCustom, onRemove, props.id]);\n  return (\n    props.index !== undefined && (\n      <div style={styleDialogLayer}>\n        <Outside onOutsideClick={() => props.index === 0 && isRemoveOnOutsideClick && onRemove?.()}>\n          <motion.dialog\n            key={props.id}\n            className={setClasses([DialogClass.element])}\n            initial={{\n              opacity: 0,\n              scale: 0.8,\n            }}\n            animate={{\n              opacity: 1,\n              scale: 1,\n            }}\n            onAnimationComplete={() => setIsAnimating(false)}\n            transition={{\n              type: 'spring',\n              duration: DEFAULT_PROVIDER_DIALOG_DURATION_ELEMENT,\n              delay: DEFAULT_PROVIDER_DIALOG_DURATION_LAYOUT,\n            }}\n            style={styleDialogElement}\n          >\n            {children}\n          </motion.dialog>\n        </Outside>\n      </div>\n    )\n  );\n};\nconst MemoizedDialogElement = memo(DialogElement);\n","import { useDeepCompareMemoize } from '@local/hooks/use-deep-compare-memoize';\n\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useContextSelector } from 'use-context-selector';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { DialogContext } from './context';\nimport { IDialogContext, IDialogItem, IUseDialog, IUseDialogDependencies } from './context.types';\n\nexport const useDialogs = (props: IUseDialogDependencies): IDialogContext => {\n  const context = useContextSelector(DialogContext, (v) => {\n    return v\n      ? props.reduce((acc, prop) => {\n          acc[prop] = v[prop];\n          return acc;\n        }, {} as any)\n      : null;\n  });\n  if (!context) {\n    throw new Error('useDialogs must be used within an DialogContext');\n  }\n  return context;\n};\n\nexport const useDialog = <T extends object = Record<string, unknown>>(props?: IUseDialog<T>): IDialogItem => {\n  const { add, remove, update, dialogHistory } = useDialogs(['add', 'remove', 'update', 'dialogHistory']);\n  const [id, setId] = useState<string | null>(null);\n  const refId = useRef<string | null>(null);\n  const propsMemo = useDeepCompareMemoize(props);\n  const isOpen = useMemo(() => {\n    return id !== null && dialogHistory.some((dialog) => dialog.id === id);\n  }, [dialogHistory, id]);\n\n  const localRemove = useCallback(() => {\n    const dialogId = refId.current;\n\n    if (!dialogId) return;\n\n    setId(null);\n    refId.current = null;\n    remove(dialogId);\n  }, [remove]);\n\n  const localAdd: IDialogItem['add'] = useCallback(() => {\n    if (refId.current) return;\n    const dialogId = uuidv4();\n    setId(dialogId);\n    refId.current = dialogId;\n    add({\n      id: dialogId,\n      props: propsMemo as IUseDialog<Record<string, unknown>>,\n      onRemove: () => {\n        localRemove();\n        propsMemo?.onRemove?.();\n      },\n    });\n  }, [add, propsMemo, localRemove]);\n\n  useEffect(() => {\n    const dialogId = refId.current;\n\n    if (!dialogId) return;\n\n    if (!dialogHistory.some((dialog) => dialog.id === dialogId)) {\n      setId(null);\n      refId.current = null;\n    }\n  }, [dialogHistory]);\n\n  useEffect(() => {\n    if (refId.current) {\n      update({ id: refId.current, props: propsMemo as IUseDialog<Record<string, unknown>> });\n    }\n  }, [propsMemo, update]);\n\n  return { add: localAdd, remove: localRemove, id: id, isOpen: isOpen };\n};\n"],"mappings":"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"}

package/build/{context-dialog-DzwL2ElF.js → context-dialog-IYNzoNOe.js}

@@ -2,7 +2,7 @@ import { n as O, r as R } from "./utils-BRgi6734.js";
 import { t as C } from "./functions-DzX-pTN8.js";
 import { t as y } from "./proxy-BFHkqO7P.js";
 import { t as T } from "./AnimatePresence-BWc2vFe-.js";
-import { t as h } from "./outside-DopxX0PZ.js";
+import { t as h } from "./outside-_oOot7z3.js";
 import { useDeepCompareMemoize as S } from "./hooks-use-deep-compare-memoize.es.js";
 import { n as N, t as M } from "./dist-ck-7oUux.js";
 import { t as U } from "./v4-CYaPyb-W.js";
@@ -188,4 +188,4 @@ export {
   te as t
 };
 
-//# sourceMappingURL=context-dialog-DzwL2ElF.js.map
+//# sourceMappingURL=context-dialog-IYNzoNOe.js.map

package/build/{context-dialog-DzwL2ElF.js.map → context-dialog-IYNzoNOe.js.map}

@@ -1 +1 @@
-{"version":3,"file":"context-dialog-DzwL2ElF.js","names":[],"sources":["../src/contexts/context-dialog/context.constants.ts","../src/contexts/context-dialog/context.styles.tsx","../src/contexts/context-dialog/context.tsx","../src/contexts/context-dialog/context.hooks.ts"],"sourcesContent":["import { IThemePalette } from '@local/styles/utils';\n\nexport const DEFAULT_PROVIDER_DIALOG_DURATION_ELEMENT = 0.3;\nexport const DEFAULT_PROVIDER_DIALOG_DURATION_LAYOUT = 0.4;\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_HEIGHT: string = 'max-content';\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_WIDTH: string = 'max-content';\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_BORDER_RADIUS: string = '12px';\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_PADDING: string = '20px';\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_BACKGROUND: IThemePalette = 'fillDarkStable';\n","import { CSS_CLASS, CSS_VARS } from '@local/styles/utils';\n\nimport { CSSProperties } from 'react';\n\nimport {\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_BACKGROUND,\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_BORDER_RADIUS,\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_HEIGHT,\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_WIDTH,\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_PADDING,\n} from './context.constants';\nimport { IDialogElementStyle, IDialogLayoutStyle } from './context.types';\n\nexport const DialogClass = CSS_CLASS.context.dialog;\n\nexport const getDialogLayoutClassName = () => DialogClass.layout;\n\nexport const getDialogLayoutStyle = (props: IDialogLayoutStyle): CSSProperties => ({\n  backgroundColor: CSS_VARS.palette.fillSecondaryLightStable,\n  zIndex: props.zIndex,\n});\n\nexport const getDialogElementStyle = (props: IDialogElementStyle): CSSProperties => ({\n  maxWidth: props.propsDialog?.maxWidth || DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_WIDTH,\n  maxHeight: props.propsDialog?.maxHeight || DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_HEIGHT,\n  borderRadius: props.propsDialog?.borderRadius || DEFAULT_PROVIDER_DIALOG_ELEMENT_BORDER_RADIUS,\n  background: props.propsDialog?.background\n    ? CSS_VARS.palette[props.propsDialog.background]\n    : CSS_VARS.palette[DEFAULT_PROVIDER_DIALOG_ELEMENT_BACKGROUND],\n  padding: props.propsDialog?.padding || DEFAULT_PROVIDER_DIALOG_ELEMENT_PADDING,\n});\n","import { Outside } from '@local/areas/outside';\nimport { setClasses } from '@local/styles/utils/functions';\n\nimport { AnimatePresence, motion } from 'framer-motion';\nimport { CSSProperties, FC, memo, useCallback, useEffect, useMemo, useState } from 'react';\nimport { createContext } from 'use-context-selector';\n\nimport { DEFAULT_PROVIDER_DIALOG_DURATION_ELEMENT, DEFAULT_PROVIDER_DIALOG_DURATION_LAYOUT } from './context.constants';\nimport { DialogClass, getDialogElementStyle, getDialogLayoutClassName, getDialogLayoutStyle } from './context.styles';\nimport { IDialogContent, IDialogContext, IDialogElement, IDialogProvider } from './context.types';\n\nexport const DialogContext = createContext<IDialogContext | null>(null);\n\nexport const ProviderDialog: FC<IDialogProvider> = (props) => {\n  const [dialogHistory, setDialogHistory] = useState<IDialogContent[]>([]);\n  const classNameDialogLayout = getDialogLayoutClassName();\n\n  const remove: IDialogContext['remove'] = useCallback((id) => {\n    setDialogHistory((prev) => {\n      const itemToRemove = prev.find((item) => item.id === id);\n\n      if (itemToRemove === undefined) return prev;\n\n      const indexToRemove = itemToRemove.index;\n\n      if (indexToRemove === undefined) return prev;\n\n      const updatedHistory = prev\n        .filter((item) => item.id !== id)\n        .map((item) => {\n          const index = item.index;\n          if (index === undefined) return item;\n\n          return {\n            ...item,\n            index: index > indexToRemove ? index - 1 : item.index,\n          };\n        });\n\n      return updatedHistory;\n    });\n  }, []);\n\n  const update: IDialogContext['update'] = useCallback((dialog) => {\n    setDialogHistory((prev) => {\n      return prev.map((item) => {\n        if (item.id === dialog.id) {\n          return { ...item, ...dialog };\n        }\n        return item;\n      });\n    });\n  }, []);\n\n  const add: IDialogContext['add'] = useCallback((dialog) => {\n    const id = dialog.id;\n\n    setDialogHistory((prev) => {\n      const existingIndex = prev.findIndex((item) => item.id === id);\n\n      let updatedHistory: IDialogContent[];\n\n      if (existingIndex !== -1) {\n        updatedHistory = [...prev];\n        updatedHistory[existingIndex] = { ...dialog, id, index: prev[existingIndex].index };\n      } else {\n        updatedHistory = prev.map((item) => {\n          const index = item.index;\n          if (index === undefined) return item;\n\n          return {\n            ...item,\n            index: index + 1,\n          };\n        });\n        const newContent = { ...dialog, id, index: 0 };\n        updatedHistory.unshift(newContent);\n      }\n\n      return updatedHistory;\n    });\n  }, []);\n\n  const dialogHistoryLength = useMemo(() => dialogHistory.length, [dialogHistory.length]);\n  const zIndex = useMemo(() => props.zIndex, [props.zIndex]);\n\n  useEffect(() => {\n    return () => {\n      setDialogHistory([]);\n    };\n  }, []);\n  return (\n    <DialogContext.Provider value={{ add, remove, update, dialogHistory }}>\n      <AnimatePresence>\n        {dialogHistoryLength && (\n          <motion.div\n            className={classNameDialogLayout}\n            style={getDialogLayoutStyle({ zIndex })}\n            initial={{\n              opacity: 0,\n            }}\n            exit={{\n              opacity: 0,\n            }}\n            animate={{\n              opacity: 1,\n            }}\n            transition={{ type: 'spring', duration: DEFAULT_PROVIDER_DIALOG_DURATION_LAYOUT }}\n          >\n            {[...dialogHistory].reverse().map((dialog) => {\n              return (\n                <MemoizedDialogElement\n                  key={dialog.id}\n                  index={dialog.index}\n                  props={dialog.props}\n                  id={dialog.id}\n                  onRemove={dialog.onRemove}\n                />\n              );\n            })}\n          </motion.div>\n        )}\n      </AnimatePresence>\n\n      {props.children}\n    </DialogContext.Provider>\n  );\n};\n\nconst DialogElement = (props: IDialogElement<Record<string, unknown>>) => {\n  const [isAnimating, setIsAnimating] = useState(true);\n  const styleDialogElement = useMemo(() => {\n    return {\n      ...getDialogElementStyle({\n        propsDialog: props.props?.propsDialog,\n      }),\n    };\n  }, [props.props?.propsDialog]);\n  const styleDialogLayer = useMemo<CSSProperties>(() => {\n    return {\n      position: 'absolute',\n      inset: 0,\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      pointerEvents: props.index === 0 ? 'auto' : 'none',\n    };\n  }, [props.index]);\n\n  const isRemoveOnOutsideClick = useMemo(\n    () => props.props?.propsDialog?.isRemoveOnOutsideClick ?? true,\n    [props.props?.propsDialog?.isRemoveOnOutsideClick],\n  );\n  const onRemove = useCallback(() => {\n    props.props?.onRemove?.();\n    props.onRemove?.();\n  }, [props.onRemove, props.props?.onRemove]);\n\n  const Content = props.props?.content;\n  const children = useMemo(() => {\n    if (props.id === undefined || Content === undefined) return null;\n\n    return <Content remove={onRemove} isAnimating={isAnimating} propsCustom={props.props?.propsCustom} id={props.id} />;\n  }, [Content, isAnimating, props.props?.propsCustom, onRemove, props.id]);\n  return (\n    props.index !== undefined && (\n      <div style={styleDialogLayer}>\n        <Outside onOutsideClick={() => props.index === 0 && isRemoveOnOutsideClick && onRemove?.()}>\n          <motion.dialog\n            key={props.id}\n            className={setClasses([DialogClass.element])}\n            initial={{\n              opacity: 0,\n              scale: 0.8,\n            }}\n            animate={{\n              opacity: 1,\n              scale: 1,\n            }}\n            onAnimationComplete={() => setIsAnimating(false)}\n            transition={{\n              type: 'spring',\n              duration: DEFAULT_PROVIDER_DIALOG_DURATION_ELEMENT,\n              delay: DEFAULT_PROVIDER_DIALOG_DURATION_LAYOUT,\n            }}\n            style={styleDialogElement}\n          >\n            {children}\n          </motion.dialog>\n        </Outside>\n      </div>\n    )\n  );\n};\nconst MemoizedDialogElement = memo(DialogElement);\n","import { useDeepCompareMemoize } from '@local/hooks/use-deep-compare-memoize';\n\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useContextSelector } from 'use-context-selector';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { DialogContext } from './context';\nimport { IDialogContext, IDialogItem, IUseDialog, IUseDialogDependencies } from './context.types';\n\nexport const useDialogs = (props: IUseDialogDependencies): IDialogContext => {\n  const context = useContextSelector(DialogContext, (v) => {\n    return v\n      ? props.reduce((acc, prop) => {\n          acc[prop] = v[prop];\n          return acc;\n        }, {} as any)\n      : null;\n  });\n  if (!context) {\n    throw new Error('useDialogs must be used within an DialogContext');\n  }\n  return context;\n};\n\nexport const useDialog = <T extends object = Record<string, unknown>>(props?: IUseDialog<T>): IDialogItem => {\n  const { add, remove, update, dialogHistory } = useDialogs(['add', 'remove', 'update', 'dialogHistory']);\n  const [id, setId] = useState<string | null>(null);\n  const refId = useRef<string | null>(null);\n  const propsMemo = useDeepCompareMemoize(props);\n  const isOpen = useMemo(() => {\n    return id !== null && dialogHistory.some((dialog) => dialog.id === id);\n  }, [dialogHistory, id]);\n\n  const localRemove = useCallback(() => {\n    const dialogId = refId.current;\n\n    if (!dialogId) return;\n\n    setId(null);\n    refId.current = null;\n    remove(dialogId);\n  }, [remove]);\n\n  const localAdd: IDialogItem['add'] = useCallback(() => {\n    if (refId.current) return;\n    const dialogId = uuidv4();\n    setId(dialogId);\n    refId.current = dialogId;\n    add({\n      id: dialogId,\n      props: propsMemo as IUseDialog<Record<string, unknown>>,\n      onRemove: () => {\n        localRemove();\n        propsMemo?.onRemove?.();\n      },\n    });\n  }, [add, propsMemo, localRemove]);\n\n  useEffect(() => {\n    const dialogId = refId.current;\n\n    if (!dialogId) return;\n\n    if (!dialogHistory.some((dialog) => dialog.id === dialogId)) {\n      setId(null);\n      refId.current = null;\n    }\n  }, [dialogHistory]);\n\n  useEffect(() => {\n    if (refId.current) {\n      update({ id: refId.current, props: propsMemo as IUseDialog<Record<string, unknown>> });\n    }\n  }, [propsMemo, update]);\n\n  return { add: localAdd, remove: localRemove, id: id, isOpen: isOpen };\n};\n"],"mappings":"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"}
+{"version":3,"file":"context-dialog-IYNzoNOe.js","names":[],"sources":["../src/contexts/context-dialog/context.constants.ts","../src/contexts/context-dialog/context.styles.tsx","../src/contexts/context-dialog/context.tsx","../src/contexts/context-dialog/context.hooks.ts"],"sourcesContent":["import { IThemePalette } from '@local/styles/utils';\n\nexport const DEFAULT_PROVIDER_DIALOG_DURATION_ELEMENT = 0.3;\nexport const DEFAULT_PROVIDER_DIALOG_DURATION_LAYOUT = 0.4;\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_HEIGHT: string = 'max-content';\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_WIDTH: string = 'max-content';\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_BORDER_RADIUS: string = '12px';\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_PADDING: string = '20px';\nexport const DEFAULT_PROVIDER_DIALOG_ELEMENT_BACKGROUND: IThemePalette = 'fillDarkStable';\n","import { CSS_CLASS, CSS_VARS } from '@local/styles/utils';\n\nimport { CSSProperties } from 'react';\n\nimport {\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_BACKGROUND,\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_BORDER_RADIUS,\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_HEIGHT,\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_WIDTH,\n  DEFAULT_PROVIDER_DIALOG_ELEMENT_PADDING,\n} from './context.constants';\nimport { IDialogElementStyle, IDialogLayoutStyle } from './context.types';\n\nexport const DialogClass = CSS_CLASS.context.dialog;\n\nexport const getDialogLayoutClassName = () => DialogClass.layout;\n\nexport const getDialogLayoutStyle = (props: IDialogLayoutStyle): CSSProperties => ({\n  backgroundColor: CSS_VARS.palette.fillSecondaryLightStable,\n  zIndex: props.zIndex,\n});\n\nexport const getDialogElementStyle = (props: IDialogElementStyle): CSSProperties => ({\n  maxWidth: props.propsDialog?.maxWidth || DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_WIDTH,\n  maxHeight: props.propsDialog?.maxHeight || DEFAULT_PROVIDER_DIALOG_ELEMENT_MAX_HEIGHT,\n  borderRadius: props.propsDialog?.borderRadius || DEFAULT_PROVIDER_DIALOG_ELEMENT_BORDER_RADIUS,\n  background: props.propsDialog?.background\n    ? CSS_VARS.palette[props.propsDialog.background]\n    : CSS_VARS.palette[DEFAULT_PROVIDER_DIALOG_ELEMENT_BACKGROUND],\n  padding: props.propsDialog?.padding || DEFAULT_PROVIDER_DIALOG_ELEMENT_PADDING,\n});\n","import { Outside } from '@local/areas/outside';\nimport { setClasses } from '@local/styles/utils/functions';\n\nimport { AnimatePresence, motion } from 'framer-motion';\nimport { CSSProperties, FC, memo, useCallback, useEffect, useMemo, useState } from 'react';\nimport { createContext } from 'use-context-selector';\n\nimport { DEFAULT_PROVIDER_DIALOG_DURATION_ELEMENT, DEFAULT_PROVIDER_DIALOG_DURATION_LAYOUT } from './context.constants';\nimport { DialogClass, getDialogElementStyle, getDialogLayoutClassName, getDialogLayoutStyle } from './context.styles';\nimport { IDialogContent, IDialogContext, IDialogElement, IDialogProvider } from './context.types';\n\nexport const DialogContext = createContext<IDialogContext | null>(null);\n\nexport const ProviderDialog: FC<IDialogProvider> = (props) => {\n  const [dialogHistory, setDialogHistory] = useState<IDialogContent[]>([]);\n  const classNameDialogLayout = getDialogLayoutClassName();\n\n  const remove: IDialogContext['remove'] = useCallback((id) => {\n    setDialogHistory((prev) => {\n      const itemToRemove = prev.find((item) => item.id === id);\n\n      if (itemToRemove === undefined) return prev;\n\n      const indexToRemove = itemToRemove.index;\n\n      if (indexToRemove === undefined) return prev;\n\n      const updatedHistory = prev\n        .filter((item) => item.id !== id)\n        .map((item) => {\n          const index = item.index;\n          if (index === undefined) return item;\n\n          return {\n            ...item,\n            index: index > indexToRemove ? index - 1 : item.index,\n          };\n        });\n\n      return updatedHistory;\n    });\n  }, []);\n\n  const update: IDialogContext['update'] = useCallback((dialog) => {\n    setDialogHistory((prev) => {\n      return prev.map((item) => {\n        if (item.id === dialog.id) {\n          return { ...item, ...dialog };\n        }\n        return item;\n      });\n    });\n  }, []);\n\n  const add: IDialogContext['add'] = useCallback((dialog) => {\n    const id = dialog.id;\n\n    setDialogHistory((prev) => {\n      const existingIndex = prev.findIndex((item) => item.id === id);\n\n      let updatedHistory: IDialogContent[];\n\n      if (existingIndex !== -1) {\n        updatedHistory = [...prev];\n        updatedHistory[existingIndex] = { ...dialog, id, index: prev[existingIndex].index };\n      } else {\n        updatedHistory = prev.map((item) => {\n          const index = item.index;\n          if (index === undefined) return item;\n\n          return {\n            ...item,\n            index: index + 1,\n          };\n        });\n        const newContent = { ...dialog, id, index: 0 };\n        updatedHistory.unshift(newContent);\n      }\n\n      return updatedHistory;\n    });\n  }, []);\n\n  const dialogHistoryLength = useMemo(() => dialogHistory.length, [dialogHistory.length]);\n  const zIndex = useMemo(() => props.zIndex, [props.zIndex]);\n\n  useEffect(() => {\n    return () => {\n      setDialogHistory([]);\n    };\n  }, []);\n  return (\n    <DialogContext.Provider value={{ add, remove, update, dialogHistory }}>\n      <AnimatePresence>\n        {dialogHistoryLength && (\n          <motion.div\n            className={classNameDialogLayout}\n            style={getDialogLayoutStyle({ zIndex })}\n            initial={{\n              opacity: 0,\n            }}\n            exit={{\n              opacity: 0,\n            }}\n            animate={{\n              opacity: 1,\n            }}\n            transition={{ type: 'spring', duration: DEFAULT_PROVIDER_DIALOG_DURATION_LAYOUT }}\n          >\n            {[...dialogHistory].reverse().map((dialog) => {\n              return (\n                <MemoizedDialogElement\n                  key={dialog.id}\n                  index={dialog.index}\n                  props={dialog.props}\n                  id={dialog.id}\n                  onRemove={dialog.onRemove}\n                />\n              );\n            })}\n          </motion.div>\n        )}\n      </AnimatePresence>\n\n      {props.children}\n    </DialogContext.Provider>\n  );\n};\n\nconst DialogElement = (props: IDialogElement<Record<string, unknown>>) => {\n  const [isAnimating, setIsAnimating] = useState(true);\n  const styleDialogElement = useMemo(() => {\n    return {\n      ...getDialogElementStyle({\n        propsDialog: props.props?.propsDialog,\n      }),\n    };\n  }, [props.props?.propsDialog]);\n  const styleDialogLayer = useMemo<CSSProperties>(() => {\n    return {\n      position: 'absolute',\n      inset: 0,\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      pointerEvents: props.index === 0 ? 'auto' : 'none',\n    };\n  }, [props.index]);\n\n  const isRemoveOnOutsideClick = useMemo(\n    () => props.props?.propsDialog?.isRemoveOnOutsideClick ?? true,\n    [props.props?.propsDialog?.isRemoveOnOutsideClick],\n  );\n  const onRemove = useCallback(() => {\n    props.props?.onRemove?.();\n    props.onRemove?.();\n  }, [props.onRemove, props.props?.onRemove]);\n\n  const Content = props.props?.content;\n  const children = useMemo(() => {\n    if (props.id === undefined || Content === undefined) return null;\n\n    return <Content remove={onRemove} isAnimating={isAnimating} propsCustom={props.props?.propsCustom} id={props.id} />;\n  }, [Content, isAnimating, props.props?.propsCustom, onRemove, props.id]);\n  return (\n    props.index !== undefined && (\n      <div style={styleDialogLayer}>\n        <Outside onOutsideClick={() => props.index === 0 && isRemoveOnOutsideClick && onRemove?.()}>\n          <motion.dialog\n            key={props.id}\n            className={setClasses([DialogClass.element])}\n            initial={{\n              opacity: 0,\n              scale: 0.8,\n            }}\n            animate={{\n              opacity: 1,\n              scale: 1,\n            }}\n            onAnimationComplete={() => setIsAnimating(false)}\n            transition={{\n              type: 'spring',\n              duration: DEFAULT_PROVIDER_DIALOG_DURATION_ELEMENT,\n              delay: DEFAULT_PROVIDER_DIALOG_DURATION_LAYOUT,\n            }}\n            style={styleDialogElement}\n          >\n            {children}\n          </motion.dialog>\n        </Outside>\n      </div>\n    )\n  );\n};\nconst MemoizedDialogElement = memo(DialogElement);\n","import { useDeepCompareMemoize } from '@local/hooks/use-deep-compare-memoize';\n\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useContextSelector } from 'use-context-selector';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { DialogContext } from './context';\nimport { IDialogContext, IDialogItem, IUseDialog, IUseDialogDependencies } from './context.types';\n\nexport const useDialogs = (props: IUseDialogDependencies): IDialogContext => {\n  const context = useContextSelector(DialogContext, (v) => {\n    return v\n      ? props.reduce((acc, prop) => {\n          acc[prop] = v[prop];\n          return acc;\n        }, {} as any)\n      : null;\n  });\n  if (!context) {\n    throw new Error('useDialogs must be used within an DialogContext');\n  }\n  return context;\n};\n\nexport const useDialog = <T extends object = Record<string, unknown>>(props?: IUseDialog<T>): IDialogItem => {\n  const { add, remove, update, dialogHistory } = useDialogs(['add', 'remove', 'update', 'dialogHistory']);\n  const [id, setId] = useState<string | null>(null);\n  const refId = useRef<string | null>(null);\n  const propsMemo = useDeepCompareMemoize(props);\n  const isOpen = useMemo(() => {\n    return id !== null && dialogHistory.some((dialog) => dialog.id === id);\n  }, [dialogHistory, id]);\n\n  const localRemove = useCallback(() => {\n    const dialogId = refId.current;\n\n    if (!dialogId) return;\n\n    setId(null);\n    refId.current = null;\n    remove(dialogId);\n  }, [remove]);\n\n  const localAdd: IDialogItem['add'] = useCallback(() => {\n    if (refId.current) return;\n    const dialogId = uuidv4();\n    setId(dialogId);\n    refId.current = dialogId;\n    add({\n      id: dialogId,\n      props: propsMemo as IUseDialog<Record<string, unknown>>,\n      onRemove: () => {\n        localRemove();\n        propsMemo?.onRemove?.();\n      },\n    });\n  }, [add, propsMemo, localRemove]);\n\n  useEffect(() => {\n    const dialogId = refId.current;\n\n    if (!dialogId) return;\n\n    if (!dialogHistory.some((dialog) => dialog.id === dialogId)) {\n      setId(null);\n      refId.current = null;\n    }\n  }, [dialogHistory]);\n\n  useEffect(() => {\n    if (refId.current) {\n      update({ id: refId.current, props: propsMemo as IUseDialog<Record<string, unknown>> });\n    }\n  }, [propsMemo, update]);\n\n  return { add: localAdd, remove: localRemove, id: id, isOpen: isOpen };\n};\n"],"mappings":"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"}

package/build/context-dialog.cjs.js

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./chunk-Dd8m0Ver.cjs"),e=require("./context-dialog-DctdSBC8.cjs");exports.ProviderDialog=e.ProviderDialog;exports.useDialog=e.useDialog;exports.useDialogs=e.useDialogs;
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./chunk-Dd8m0Ver.cjs"),e=require("./context-dialog-BLb0fPJw.cjs");exports.ProviderDialog=e.ProviderDialog;exports.useDialog=e.useDialog;exports.useDialogs=e.useDialogs;

package/build/context-dialog.es.js

@@ -1,4 +1,4 @@
-import { n as a, r, t as s } from "./context-dialog-DzwL2ElF.js";
+import { n as a, r, t as s } from "./context-dialog-IYNzoNOe.js";
 export {
   r as ProviderDialog,
   s as useDialog,

package/build/{context-sonner-Dqw0jhwT.cjs → context-sonner-B-eO7pwI.cjs}

@@ -1,3 +1,3 @@
-const ae=require("./chunk-Dd8m0Ver.cjs"),u=require("./utils-DCIq-5FL.cjs"),P=require("./functions-CZrZU5U0.cjs"),B=require("./proxy-BDese6Pb.cjs"),H=require("./AnimatePresence-DeKd4Eek.cjs"),_=require("./icon-Ddkbk3-m.cjs"),z=require("./button-CHEeSypf.cjs"),O=require("./dist-SXTf0-_7.cjs"),M=require("./v4-BDi_Luux.cjs");let r=require("react/jsx-runtime"),i=require("react");var U=.04,F=.3;var G={content:"Undo",onClick:()=>{}},d=u.CSS_CLASS.context.sonner,W=d.layout,$=d.elementWrapper,K=d.content,Y=d.icon,J=d.contentTitle,Q=d.contentDescription,X=d.buttonWrapper,Z={"bottom-center":d.layoutBottomCenter,"bottom-left":d.layoutBottomLeft,"bottom-right":d.layoutBottomRight,"top-right":d.layoutTopRight,"top-left":d.layoutTopLeft,"top-center":d.layoutTopCenter},p=e=>P.setClasses([W,Z[e]]),ee=e=>({"--context-sonner-gap":`${e.gap}px`,"--context-sonner-z-index":`${e.zIndex??0}`}),ne=e=>{const t=u.CSS_VARS.genre.button[e];return{"--context-sonner-wrapper-background":t.background.index,"--context-sonner-wrapper-border-color":t.border.index,"--context-sonner-wrapper-box-shadow":e==="primary"||e==="secondary"?u.CSS_VARS.palette.shadowPrimaryLight:u.CSS_VARS.palette.shadowSecondaryLight,"--context-sonner-wrapper-box-shadow-hover":e==="primary"||e==="secondary"?u.CSS_VARS.palette.shadowSecondaryLight:u.CSS_VARS.palette.shadowPrimaryLight,"--context-sonner-icon-color":t.color.index,"--context-sonner-title-color":t.color.index,"--context-sonner-description-color":t.color.index}},k=O.createContext(null),te=e=>{const t=(0,i.useMemo)(()=>e.visibleToasts,[e.visibleToasts]),S=(0,i.useMemo)(()=>e?.default?.description,[e?.default?.description]),f=(0,i.useMemo)(()=>e?.default?.title,[e?.default?.title]),g=(0,i.useMemo)(()=>e?.default?.button,[e?.default?.button]),b=(0,i.useMemo)(()=>e?.default?.hidingTime,[e?.default?.hidingTime]),I=(0,i.useMemo)(()=>e?.default?.hidingMode??"clickOnButton",[e?.default?.hidingMode]),E=(0,i.useMemo)(()=>e?.default?.genre??"product",[e?.default?.genre]),w=(0,i.useMemo)(()=>e.position.includes("top"),[e.position]),[C,y]=(0,i.useState)([]),[R,L]=(0,i.useState)(!1),N=(0,i.useCallback)(()=>{L(!0)},[]),T=(0,i.useCallback)(()=>{L(!1)},[]),x=(0,i.useCallback)(n=>{y(a=>{const s=a.find(o=>o.id===n);if(!s)return a;const c=s.index,l=a.filter(o=>o.id!==n).map(o=>({...o,index:o.index>c?o.index-1:o.index}));return l.length===0&&T(),l})},[T]),m=(0,i.useCallback)(n=>{const a=n.id??M.v4(),s=n.hidingTime??b;y(c=>{const l=c.findIndex(h=>h.id===a);let o;if(l!==-1)o=[...c],o[l]={...n,id:a,index:c[l].index};else{o=c.map(v=>({...v,index:v.index+1}));const h={...n,id:a,index:0};o.unshift(h)}return o}),s!==void 0&&setTimeout(()=>{x(a)},s)},[b,x]),D=(0,i.useCallback)((n,a,s)=>{const c=M.v4();return m({...a,id:c,isLoading:!0}),n.then(l=>{m({...s(l,void 0),id:c})}).catch(l=>{m({...s(void 0,l),id:c})})},[m]),q=(0,i.useCallback)(n=>{x(n)},[x]);return(0,i.useEffect)(()=>()=>{y([])},[]),(0,r.jsxs)(k.Provider,{value:{toast:m,promise:D,remove:x,contentHistory:C},children:[(0,r.jsx)("div",{className:p(e.position),style:ee({gap:e.gap,zIndex:e.zIndex??100}),onMouseEnter:N,onMouseLeave:T,children:(0,r.jsx)(H.AnimatePresence,{children:C.map(n=>{const a=n.index,s=t?a>t:!1,c=t?a>t-1:!1,l=t?a===t-1:!1,o=n.genre??E,h=o,v=n.hidingMode??I,V="content"in n?n.content:!1,j="title"in n?n.title:!1,A="description"in n?n.description:!1;return(0,r.jsx)(oe,{isMoreThanLastViewIndexPlusOne:s,isMoreThanLastViewIndex:c,isLastViewIndex:l,isTop:w,id:n.id,icon:n.icon,isLoading:n.isLoading,index:a,buttonGenre:h,hidingMode:v,isHovered:R,genre:o,content:V,title:j||f,description:A||S,button:n.button??g??G,handleOnClick:q},n.id)})})}),e.children]})},ie=e=>(0,r.jsx)(B.motion.div,{layout:!0,initial:{opacity:0,scale:1,y:e.isLastViewIndex?e.isTop?100:-100:e.isTop?-100:100},animate:{y:0,opacity:e.isMoreThanLastViewIndex?0:1,pointerEvents:e.isMoreThanLastViewIndex?"none":"auto",display:e.isMoreThanLastViewIndex?"none":"flex",scale:e.isHovered?1:Math.max(1-e.index*U,.88),marginTop:e.isTop?e.isHovered||e.index===0?"0px":"-65px":"0px",marginBottom:e.isTop||e.isHovered||e.index===0?"0px":"-65px"},style:{zIndex:-e.index},whileInView:{opacity:e.isMoreThanLastViewIndex?0:1},exit:{opacity:0,y:e.isTop?-100:100},transition:{type:"spring",duration:F},children:(0,r.jsxs)("div",{className:$,style:ne(e.genre),role:e.hidingMode==="clickOnSonner"?"button":void 0,tabIndex:e.hidingMode==="clickOnSonner"?0:void 0,onClick:()=>e.hidingMode==="clickOnSonner"&&e.handleOnClick(e.id,"clickOnSonner"),onKeyDown:t=>{e.hidingMode==="clickOnSonner"&&(t.key==="Enter"||t.key===" ")&&(t.preventDefault(),e.handleOnClick(e.id,"clickOnSonner"))},children:[(e.isLoading||e.icon)&&(0,r.jsx)("div",{className:Y,children:e.isLoading?(0,r.jsx)(_.Icon,{size:"medium",type:"loading",name:"Line"}):e.icon&&(0,r.jsx)(_.Icon,{...e.icon,size:e.icon.size??"medium"})}),(0,r.jsx)("div",{className:K,children:e.content?e.content:(0,r.jsxs)(r.Fragment,{children:[e.title&&(0,r.jsx)("div",{className:J,children:e.title}),e.description&&(0,r.jsx)("div",{className:Q,children:e.description})]})}),e.button&&"content"in e.button&&e.button?.content&&(0,r.jsx)("div",{className:X,children:(0,r.jsx)(z.Button,{genre:e.buttonGenre,size:"small",onClick:()=>e.hidingMode==="clickOnButton"&&e.handleOnClick(e.id,"clickOnButton"),children:e.button.content})})]})},e.id),oe=(0,i.memo)(ie),re=e=>{const t=O.useContextSelector(k,S=>S?e.reduce((f,g)=>(f[g]=S[g],f),{}):null);if(!t)throw new Error("useSonner must be used within an ProviderSonner");return t};Object.defineProperty(exports,"ProviderSonner",{enumerable:!0,get:function(){return te}});Object.defineProperty(exports,"useSonner",{enumerable:!0,get:function(){return re}});
+const ae=require("./chunk-Dd8m0Ver.cjs"),u=require("./utils-DCIq-5FL.cjs"),P=require("./functions-CZrZU5U0.cjs"),B=require("./proxy-BDese6Pb.cjs"),H=require("./AnimatePresence-DeKd4Eek.cjs"),_=require("./icon-DyjaxKWq.cjs"),z=require("./button-6CFvwtSz.cjs"),O=require("./dist-SXTf0-_7.cjs"),M=require("./v4-BDi_Luux.cjs");let r=require("react/jsx-runtime"),i=require("react");var U=.04,F=.3;var G={content:"Undo",onClick:()=>{}},d=u.CSS_CLASS.context.sonner,W=d.layout,$=d.elementWrapper,K=d.content,Y=d.icon,J=d.contentTitle,Q=d.contentDescription,X=d.buttonWrapper,Z={"bottom-center":d.layoutBottomCenter,"bottom-left":d.layoutBottomLeft,"bottom-right":d.layoutBottomRight,"top-right":d.layoutTopRight,"top-left":d.layoutTopLeft,"top-center":d.layoutTopCenter},p=e=>P.setClasses([W,Z[e]]),ee=e=>({"--context-sonner-gap":`${e.gap}px`,"--context-sonner-z-index":`${e.zIndex??0}`}),ne=e=>{const t=u.CSS_VARS.genre.button[e];return{"--context-sonner-wrapper-background":t.background.index,"--context-sonner-wrapper-border-color":t.border.index,"--context-sonner-wrapper-box-shadow":e==="primary"||e==="secondary"?u.CSS_VARS.palette.shadowPrimaryLight:u.CSS_VARS.palette.shadowSecondaryLight,"--context-sonner-wrapper-box-shadow-hover":e==="primary"||e==="secondary"?u.CSS_VARS.palette.shadowSecondaryLight:u.CSS_VARS.palette.shadowPrimaryLight,"--context-sonner-icon-color":t.color.index,"--context-sonner-title-color":t.color.index,"--context-sonner-description-color":t.color.index}},k=O.createContext(null),te=e=>{const t=(0,i.useMemo)(()=>e.visibleToasts,[e.visibleToasts]),S=(0,i.useMemo)(()=>e?.default?.description,[e?.default?.description]),f=(0,i.useMemo)(()=>e?.default?.title,[e?.default?.title]),g=(0,i.useMemo)(()=>e?.default?.button,[e?.default?.button]),b=(0,i.useMemo)(()=>e?.default?.hidingTime,[e?.default?.hidingTime]),I=(0,i.useMemo)(()=>e?.default?.hidingMode??"clickOnButton",[e?.default?.hidingMode]),E=(0,i.useMemo)(()=>e?.default?.genre??"product",[e?.default?.genre]),w=(0,i.useMemo)(()=>e.position.includes("top"),[e.position]),[C,y]=(0,i.useState)([]),[R,L]=(0,i.useState)(!1),N=(0,i.useCallback)(()=>{L(!0)},[]),T=(0,i.useCallback)(()=>{L(!1)},[]),x=(0,i.useCallback)(n=>{y(a=>{const s=a.find(o=>o.id===n);if(!s)return a;const c=s.index,l=a.filter(o=>o.id!==n).map(o=>({...o,index:o.index>c?o.index-1:o.index}));return l.length===0&&T(),l})},[T]),m=(0,i.useCallback)(n=>{const a=n.id??M.v4(),s=n.hidingTime??b;y(c=>{const l=c.findIndex(h=>h.id===a);let o;if(l!==-1)o=[...c],o[l]={...n,id:a,index:c[l].index};else{o=c.map(v=>({...v,index:v.index+1}));const h={...n,id:a,index:0};o.unshift(h)}return o}),s!==void 0&&setTimeout(()=>{x(a)},s)},[b,x]),D=(0,i.useCallback)((n,a,s)=>{const c=M.v4();return m({...a,id:c,isLoading:!0}),n.then(l=>{m({...s(l,void 0),id:c})}).catch(l=>{m({...s(void 0,l),id:c})})},[m]),q=(0,i.useCallback)(n=>{x(n)},[x]);return(0,i.useEffect)(()=>()=>{y([])},[]),(0,r.jsxs)(k.Provider,{value:{toast:m,promise:D,remove:x,contentHistory:C},children:[(0,r.jsx)("div",{className:p(e.position),style:ee({gap:e.gap,zIndex:e.zIndex??100}),onMouseEnter:N,onMouseLeave:T,children:(0,r.jsx)(H.AnimatePresence,{children:C.map(n=>{const a=n.index,s=t?a>t:!1,c=t?a>t-1:!1,l=t?a===t-1:!1,o=n.genre??E,h=o,v=n.hidingMode??I,V="content"in n?n.content:!1,j="title"in n?n.title:!1,A="description"in n?n.description:!1;return(0,r.jsx)(oe,{isMoreThanLastViewIndexPlusOne:s,isMoreThanLastViewIndex:c,isLastViewIndex:l,isTop:w,id:n.id,icon:n.icon,isLoading:n.isLoading,index:a,buttonGenre:h,hidingMode:v,isHovered:R,genre:o,content:V,title:j||f,description:A||S,button:n.button??g??G,handleOnClick:q},n.id)})})}),e.children]})},ie=e=>(0,r.jsx)(B.motion.div,{layout:!0,initial:{opacity:0,scale:1,y:e.isLastViewIndex?e.isTop?100:-100:e.isTop?-100:100},animate:{y:0,opacity:e.isMoreThanLastViewIndex?0:1,pointerEvents:e.isMoreThanLastViewIndex?"none":"auto",display:e.isMoreThanLastViewIndex?"none":"flex",scale:e.isHovered?1:Math.max(1-e.index*U,.88),marginTop:e.isTop?e.isHovered||e.index===0?"0px":"-65px":"0px",marginBottom:e.isTop||e.isHovered||e.index===0?"0px":"-65px"},style:{zIndex:-e.index},whileInView:{opacity:e.isMoreThanLastViewIndex?0:1},exit:{opacity:0,y:e.isTop?-100:100},transition:{type:"spring",duration:F},children:(0,r.jsxs)("div",{className:$,style:ne(e.genre),role:e.hidingMode==="clickOnSonner"?"button":void 0,tabIndex:e.hidingMode==="clickOnSonner"?0:void 0,onClick:()=>e.hidingMode==="clickOnSonner"&&e.handleOnClick(e.id,"clickOnSonner"),onKeyDown:t=>{e.hidingMode==="clickOnSonner"&&(t.key==="Enter"||t.key===" ")&&(t.preventDefault(),e.handleOnClick(e.id,"clickOnSonner"))},children:[(e.isLoading||e.icon)&&(0,r.jsx)("div",{className:Y,children:e.isLoading?(0,r.jsx)(_.Icon,{size:"medium",type:"loading",name:"Line"}):e.icon&&(0,r.jsx)(_.Icon,{...e.icon,size:e.icon.size??"medium"})}),(0,r.jsx)("div",{className:K,children:e.content?e.content:(0,r.jsxs)(r.Fragment,{children:[e.title&&(0,r.jsx)("div",{className:J,children:e.title}),e.description&&(0,r.jsx)("div",{className:Q,children:e.description})]})}),e.button&&"content"in e.button&&e.button?.content&&(0,r.jsx)("div",{className:X,children:(0,r.jsx)(z.Button,{genre:e.buttonGenre,size:"small",onClick:()=>e.hidingMode==="clickOnButton"&&e.handleOnClick(e.id,"clickOnButton"),children:e.button.content})})]})},e.id),oe=(0,i.memo)(ie),re=e=>{const t=O.useContextSelector(k,S=>S?e.reduce((f,g)=>(f[g]=S[g],f),{}):null);if(!t)throw new Error("useSonner must be used within an ProviderSonner");return t};Object.defineProperty(exports,"ProviderSonner",{enumerable:!0,get:function(){return te}});Object.defineProperty(exports,"useSonner",{enumerable:!0,get:function(){return re}});
 
-//# sourceMappingURL=context-sonner-Dqw0jhwT.cjs.map
+//# sourceMappingURL=context-sonner-B-eO7pwI.cjs.map