@owp/core 2.2.5 → 2.3.0

package/dist/layout/Layout.js

@@ -1,57 +1,56 @@
-var s = Object.defineProperty;
-var r = (e, a) => s(e, "name", { value: a, configurable: !0 });
+var m = Object.defineProperty;
+var r = (a, e) => m(a, "name", { value: e, configurable: !0 });
 import { jsxs as i, jsx as t } from "../node_modules/.pnpm/@emotion_react@11.14.0_@types_react@19.2.14_react@19.2.4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js";
-import { selectOwpCurrentLayoutConfig as p } from "../store/owpSettingsSlice.js";
-import { useAppSelector as f } from "../hooks/useAppStore.js";
+import { useGetCurrentLayoutConfig as f } from "../hooks/useOwpSettings.js";
 import { LinearProgress as d } from "@mui/material";
-import { styled as c } from "@mui/material/styles";
-import { useIsFetching as u, useIsMutating as x } from "@tanstack/react-query";
-import { memo as h } from "react";
-import { Outlet as y } from "react-router-dom";
-import b from "./components/layouts/FooterLayout.js";
-import g from "./components/layouts/LeftSideLayout.js";
+import { styled as p } from "@mui/material/styles";
+import { useIsFetching as c, useIsMutating as u } from "@tanstack/react-query";
+import { memo as x } from "react";
+import { Outlet as h } from "react-router-dom";
+import y from "./components/layouts/FooterLayout.js";
+import b from "./components/layouts/LeftSideLayout.js";
 import l from "./components/layouts/NavbarWrapperLayout.js";
-import v from "./components/toolbar/ToolbarLayout.js";
-import { OwpSuspense as L } from "../components/OwpSuspense/OwpSuspense.js";
-const w = c("div")(({ config: e }) => ({
-  ...e.mode === "boxed" && {
+import g from "./components/toolbar/ToolbarLayout.js";
+import { OwpSuspense as v } from "../components/OwpSuspense/OwpSuspense.js";
+const L = p("div")(({ config: a }) => ({
+  ...a.mode === "boxed" && {
     clipPath: "inset(0)",
-    maxWidth: e.containerWidth,
+    maxWidth: a.containerWidth,
     marginLeft: "auto",
     marginRight: "auto",
     boxShadow: "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)"
   },
-  ...e.mode === "container" && {
+  ...a.mode === "container" && {
     "& .container": {
-      maxWidth: e.containerWidth,
+      maxWidth: a.containerWidth,
       width: "100%",
       marginLeft: "auto",
       marginRight: "auto"
     }
   }
 }));
-function N(e) {
-  const { children: a } = e, o = f(p), m = u(), n = x();
-  return /* @__PURE__ */ i(w, { id: "owp-layout", config: o, className: "flex w-full", children: [
-    o.leftSidePanel.display && /* @__PURE__ */ t(g, {}),
+function w(a) {
+  const { children: e } = a, o = f(), n = c(), s = u();
+  return /* @__PURE__ */ i(L, { id: "owp-layout", config: o, className: "flex w-full", children: [
+    o.leftSidePanel.display && /* @__PURE__ */ t(b, {}),
     /* @__PURE__ */ i("div", { className: "flex min-w-0 flex-auto", children: [
       o.navbar.display && o.navbar.position === "left" && /* @__PURE__ */ t(l, {}),
       /* @__PURE__ */ i("main", { id: "owp-main", className: "relative z-10 flex min-h-full min-w-0 flex-auto flex-col", children: [
-        o.toolbar.display && /* @__PURE__ */ t(v, { className: o.toolbar.style === "fixed" ? "sticky top-0" : "" }),
-        !!(m || n) && /* @__PURE__ */ t("div", { className: "fixed top-0 left-0 z-30 w-full", children: /* @__PURE__ */ t(d, { color: "secondary" }) }),
+        o.toolbar.display && /* @__PURE__ */ t(g, { className: o.toolbar.style === "fixed" ? "sticky top-0" : "" }),
+        !!(n || s) && /* @__PURE__ */ t("div", { className: "fixed top-0 left-0 z-30 w-full", children: /* @__PURE__ */ t(d, { color: "secondary" }) }),
         /* @__PURE__ */ i("div", { className: "relative z-10 flex min-h-0 flex-auto flex-col", children: [
-          /* @__PURE__ */ t(L, { children: /* @__PURE__ */ t(y, {}) }),
-          a
+          /* @__PURE__ */ t(v, { children: /* @__PURE__ */ t(h, {}) }),
+          e
         ] }),
-        o.footer.display && /* @__PURE__ */ t(b, { className: o.footer.style === "fixed" ? "sticky bottom-0" : "" })
+        o.footer.display && /* @__PURE__ */ t(y, { className: o.footer.style === "fixed" ? "sticky bottom-0" : "" })
       ] }),
       o.navbar.display && o.navbar.position === "right" && /* @__PURE__ */ t(l, {})
     ] })
   ] });
 }
-r(N, "Layout");
-const T = h(N);
+r(w, "Layout");
+const B = x(w);
 export {
-  T as default
+  B as default
 };
 //# sourceMappingURL=Layout.js.map

package/dist/layout/Layout.js.map

@@ -1 +1 @@
-{"version":3,"file":"Layout.js","sources":["../../src/layout/Layout.tsx"],"sourcesContent":["import { LayoutConfigDefaultsType } from '@/configs/layoutConfig';\nimport { selectOwpCurrentLayoutConfig } from '@/store/owpSettingsSlice';\nimport { OwpSuspense } from '@/components/OwpSuspense';\nimport { useAppSelector } from '@/hooks/useAppStore';\nimport { LinearProgress } from '@mui/material';\nimport { styled } from '@mui/material/styles';\nimport { useIsFetching, useIsMutating } from '@tanstack/react-query';\nimport { memo, ReactNode } from 'react';\nimport { Outlet } from 'react-router-dom';\nimport FooterLayout from './components/layouts/FooterLayout';\nimport LeftSideLayout from './components/layouts/LeftSideLayout';\nimport NavbarWrapperLayout from './components/layouts/NavbarWrapperLayout';\nimport ToolbarLayout from './components/toolbar/ToolbarLayout';\n\nconst Root = styled('div')(({ config }: { config: LayoutConfigDefaultsType }) => ({\n  ...(config.mode === 'boxed' && {\n    clipPath: 'inset(0)',\n    maxWidth: config.containerWidth,\n    marginLeft: 'auto',\n    marginRight: 'auto',\n    boxShadow: '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',\n  }),\n  ...(config.mode === 'container' && {\n    '& .container': {\n      maxWidth: config.containerWidth,\n      width: '100%',\n      marginLeft: 'auto',\n      marginRight: 'auto',\n    },\n  }),\n}));\n\ntype LayoutProps = {\n  children?: ReactNode;\n};\n\n/**\n * The layout.\n */\nfunction Layout(props: LayoutProps) {\n  const { children } = props;\n  const config = useAppSelector(selectOwpCurrentLayoutConfig) as LayoutConfigDefaultsType;\n  const isFetching = useIsFetching();\n  const isMutating = useIsMutating();\n\n  return (\n    <Root id=\"owp-layout\" config={config} className=\"flex w-full\">\n      {config.leftSidePanel.display && <LeftSideLayout />}\n\n      <div className=\"flex min-w-0 flex-auto\">\n        {config.navbar.display && config.navbar.position === 'left' && <NavbarWrapperLayout />}\n\n        <main id=\"owp-main\" className=\"relative z-10 flex min-h-full min-w-0 flex-auto flex-col\">\n          {config.toolbar.display && (\n            <ToolbarLayout className={config.toolbar.style === 'fixed' ? 'sticky top-0' : ''} />\n          )}\n          {Boolean(isFetching || isMutating) && (\n            <div className=\"fixed top-0 left-0 z-30 w-full\">\n              <LinearProgress color=\"secondary\" />\n            </div>\n          )}\n\n          <div className=\"relative z-10 flex min-h-0 flex-auto flex-col\">\n            <OwpSuspense>\n              <Outlet />\n            </OwpSuspense>\n            {children}\n          </div>\n\n          {config.footer.display && (\n            <FooterLayout className={config.footer.style === 'fixed' ? 'sticky bottom-0' : ''} />\n          )}\n        </main>\n\n        {config.navbar.display && config.navbar.position === 'right' && <NavbarWrapperLayout />}\n      </div>\n    </Root>\n  );\n}\n\nexport default memo(Layout);\n"],"names":["Root","styled","config","Layout","props","children","useAppSelector","selectOwpCurrentLayoutConfig","isFetching","useIsFetching","isMutating","useIsMutating","jsx","LeftSideLayout","jsxs","NavbarWrapperLayout","ToolbarLayout","LinearProgress","OwpSuspense","Outlet","FooterLayout","__name","Layout$1","memo"],"mappings":";;;;;;;;;;;;;;;AAcA,MAAMA,IAAOC,EAAO,KAAK,EAAE,CAAC,EAAE,QAAAC,SAAoD;AAAA,EAChF,GAAIA,EAAO,SAAS,WAAW;AAAA,IAC7B,UAAU;AAAA,IACV,UAAUA,EAAO;AAAA,IACjB,YAAY;AAAA,IACZ,aAAa;AAAA,IACb,WAAW;AAAA,EAAA;AAAA,EAEb,GAAIA,EAAO,SAAS,eAAe;AAAA,IACjC,gBAAgB;AAAA,MACd,UAAUA,EAAO;AAAA,MACjB,OAAO;AAAA,MACP,YAAY;AAAA,MACZ,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,EAAE;AASF,SAASC,EAAOC,GAAoB;AAClC,QAAM,EAAE,UAAAC,MAAaD,GACfF,IAASI,EAAeC,CAA4B,GACpDC,IAAaC,EAAA,GACbC,IAAaC,EAAA;AAEnB,2BACGX,GAAA,EAAK,IAAG,cAAa,QAAAE,GAAgB,WAAU,eAC7C,UAAA;AAAA,IAAAA,EAAO,cAAc,WAAW,gBAAAU,EAACC,GAAA,CAAA,CAAe;AAAA,IAEjD,gBAAAC,EAAC,OAAA,EAAI,WAAU,0BACZ,UAAA;AAAA,MAAAZ,EAAO,OAAO,WAAWA,EAAO,OAAO,aAAa,4BAAWa,GAAA,EAAoB;AAAA,MAEpF,gBAAAD,EAAC,QAAA,EAAK,IAAG,YAAW,WAAU,4DAC3B,UAAA;AAAA,QAAAZ,EAAO,QAAQ,WACd,gBAAAU,EAACI,GAAA,EAAc,WAAWd,EAAO,QAAQ,UAAU,UAAU,iBAAiB,GAAA,CAAI;AAAA,QAEnF,GAAQM,KAAcE,MACrB,gBAAAE,EAAC,OAAA,EAAI,WAAU,kCACb,UAAA,gBAAAA,EAACK,GAAA,EAAe,OAAM,YAAA,CAAY,GACpC;AAAA,QAGF,gBAAAH,EAAC,OAAA,EAAI,WAAU,iDACb,UAAA;AAAA,UAAA,gBAAAF,EAACM,GAAA,EACC,UAAA,gBAAAN,EAACO,GAAA,CAAA,CAAO,GACV;AAAA,UACCd;AAAA,QAAA,GACH;AAAA,QAECH,EAAO,OAAO,WACb,gBAAAU,EAACQ,GAAA,EAAa,WAAWlB,EAAO,OAAO,UAAU,UAAU,oBAAoB,GAAA,CAAI;AAAA,MAAA,GAEvF;AAAA,MAECA,EAAO,OAAO,WAAWA,EAAO,OAAO,aAAa,6BAAYa,GAAA,CAAA,CAAoB;AAAA,IAAA,EAAA,CACvF;AAAA,EAAA,GACF;AAEJ;AAvCSM,EAAAlB,GAAA;AAyCT,MAAAmB,IAAeC,EAAKpB,CAAM;"}
+{"version":3,"file":"Layout.js","sources":["../../src/layout/Layout.tsx"],"sourcesContent":["import { LayoutConfigDefaultsType } from '@/configs/layoutConfig';\nimport { OwpSuspense } from '@/components/OwpSuspense';\nimport { useGetCurrentLayoutConfig } from '@/hooks/useOwpSettings';\nimport { LinearProgress } from '@mui/material';\nimport { styled } from '@mui/material/styles';\nimport { useIsFetching, useIsMutating } from '@tanstack/react-query';\nimport { memo, ReactNode } from 'react';\nimport { Outlet } from 'react-router-dom';\nimport FooterLayout from './components/layouts/FooterLayout';\nimport LeftSideLayout from './components/layouts/LeftSideLayout';\nimport NavbarWrapperLayout from './components/layouts/NavbarWrapperLayout';\nimport ToolbarLayout from './components/toolbar/ToolbarLayout';\n\nconst Root = styled('div')(({ config }: { config: LayoutConfigDefaultsType }) => ({\n  ...(config.mode === 'boxed' && {\n    clipPath: 'inset(0)',\n    maxWidth: config.containerWidth,\n    marginLeft: 'auto',\n    marginRight: 'auto',\n    boxShadow: '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',\n  }),\n  ...(config.mode === 'container' && {\n    '& .container': {\n      maxWidth: config.containerWidth,\n      width: '100%',\n      marginLeft: 'auto',\n      marginRight: 'auto',\n    },\n  }),\n}));\n\ntype LayoutProps = {\n  children?: ReactNode;\n};\n\n/**\n * The layout.\n */\nfunction Layout(props: LayoutProps) {\n  const { children } = props;\n  const config = useGetCurrentLayoutConfig() as LayoutConfigDefaultsType;\n  const isFetching = useIsFetching();\n  const isMutating = useIsMutating();\n\n  return (\n    <Root id=\"owp-layout\" config={config} className=\"flex w-full\">\n      {config.leftSidePanel.display && <LeftSideLayout />}\n\n      <div className=\"flex min-w-0 flex-auto\">\n        {config.navbar.display && config.navbar.position === 'left' && <NavbarWrapperLayout />}\n\n        <main id=\"owp-main\" className=\"relative z-10 flex min-h-full min-w-0 flex-auto flex-col\">\n          {config.toolbar.display && (\n            <ToolbarLayout className={config.toolbar.style === 'fixed' ? 'sticky top-0' : ''} />\n          )}\n          {Boolean(isFetching || isMutating) && (\n            <div className=\"fixed top-0 left-0 z-30 w-full\">\n              <LinearProgress color=\"secondary\" />\n            </div>\n          )}\n\n          <div className=\"relative z-10 flex min-h-0 flex-auto flex-col\">\n            <OwpSuspense>\n              <Outlet />\n            </OwpSuspense>\n            {children}\n          </div>\n\n          {config.footer.display && (\n            <FooterLayout className={config.footer.style === 'fixed' ? 'sticky bottom-0' : ''} />\n          )}\n        </main>\n\n        {config.navbar.display && config.navbar.position === 'right' && <NavbarWrapperLayout />}\n      </div>\n    </Root>\n  );\n}\n\nexport default memo(Layout);\n"],"names":["Root","styled","config","Layout","props","children","useGetCurrentLayoutConfig","isFetching","useIsFetching","isMutating","useIsMutating","jsx","LeftSideLayout","jsxs","NavbarWrapperLayout","ToolbarLayout","LinearProgress","OwpSuspense","Outlet","FooterLayout","__name","Layout$1","memo"],"mappings":";;;;;;;;;;;;;;AAaA,MAAMA,IAAOC,EAAO,KAAK,EAAE,CAAC,EAAE,QAAAC,SAAoD;AAAA,EAChF,GAAIA,EAAO,SAAS,WAAW;AAAA,IAC7B,UAAU;AAAA,IACV,UAAUA,EAAO;AAAA,IACjB,YAAY;AAAA,IACZ,aAAa;AAAA,IACb,WAAW;AAAA,EAAA;AAAA,EAEb,GAAIA,EAAO,SAAS,eAAe;AAAA,IACjC,gBAAgB;AAAA,MACd,UAAUA,EAAO;AAAA,MACjB,OAAO;AAAA,MACP,YAAY;AAAA,MACZ,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,EAAE;AASF,SAASC,EAAOC,GAAoB;AAClC,QAAM,EAAE,UAAAC,MAAaD,GACfF,IAASI,EAAA,GACTC,IAAaC,EAAA,GACbC,IAAaC,EAAA;AAEnB,2BACGV,GAAA,EAAK,IAAG,cAAa,QAAAE,GAAgB,WAAU,eAC7C,UAAA;AAAA,IAAAA,EAAO,cAAc,WAAW,gBAAAS,EAACC,GAAA,CAAA,CAAe;AAAA,IAEjD,gBAAAC,EAAC,OAAA,EAAI,WAAU,0BACZ,UAAA;AAAA,MAAAX,EAAO,OAAO,WAAWA,EAAO,OAAO,aAAa,4BAAWY,GAAA,EAAoB;AAAA,MAEpF,gBAAAD,EAAC,QAAA,EAAK,IAAG,YAAW,WAAU,4DAC3B,UAAA;AAAA,QAAAX,EAAO,QAAQ,WACd,gBAAAS,EAACI,GAAA,EAAc,WAAWb,EAAO,QAAQ,UAAU,UAAU,iBAAiB,GAAA,CAAI;AAAA,QAEnF,GAAQK,KAAcE,MACrB,gBAAAE,EAAC,OAAA,EAAI,WAAU,kCACb,UAAA,gBAAAA,EAACK,GAAA,EAAe,OAAM,YAAA,CAAY,GACpC;AAAA,QAGF,gBAAAH,EAAC,OAAA,EAAI,WAAU,iDACb,UAAA;AAAA,UAAA,gBAAAF,EAACM,GAAA,EACC,UAAA,gBAAAN,EAACO,GAAA,CAAA,CAAO,GACV;AAAA,UACCb;AAAA,QAAA,GACH;AAAA,QAECH,EAAO,OAAO,WACb,gBAAAS,EAACQ,GAAA,EAAa,WAAWjB,EAAO,OAAO,UAAU,UAAU,oBAAoB,GAAA,CAAI;AAAA,MAAA,GAEvF;AAAA,MAECA,EAAO,OAAO,WAAWA,EAAO,OAAO,aAAa,6BAAYY,GAAA,CAAA,CAAoB;AAAA,IAAA,EAAA,CACvF;AAAA,EAAA,GACF;AAEJ;AAvCSM,EAAAjB,GAAA;AAyCT,MAAAkB,IAAeC,EAAKnB,CAAM;"}

package/dist/layout/components/layouts/FooterLayout.js

@@ -1,20 +1,19 @@
 var l = Object.defineProperty;
 var t = (e, o) => l(e, "name", { value: o, configurable: !0 });
 import { jsx as a } from "../../../node_modules/.pnpm/@emotion_react@11.14.0_@types_react@19.2.14_react@19.2.4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js";
-import { selectFooterTheme as p } from "../../../store/owpSettingsSlice.js";
-import { useAppSelector as c } from "../../../hooks/useAppStore.js";
-import f from "@mui/material/AppBar";
-import { ThemeProvider as n } from "@mui/material/styles";
-import d from "@mui/material/Toolbar";
-import { clsx as i } from "../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js";
-import { memo as u } from "react";
-function s(e) {
-  const { className: o } = e, r = c(p);
-  return /* @__PURE__ */ a(n, { theme: r, children: /* @__PURE__ */ a(
-    f,
+import { useGetFooterTheme as p } from "../../../hooks/useOwpSettings.js";
+import c from "@mui/material/AppBar";
+import { ThemeProvider as f } from "@mui/material/styles";
+import n from "@mui/material/Toolbar";
+import { clsx as d } from "../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js";
+import { memo as i } from "react";
+function u(e) {
+  const { className: o } = e, r = p();
+  return /* @__PURE__ */ a(f, { theme: r, children: /* @__PURE__ */ a(
+    c,
     {
       id: "owp-footer",
-      className: i("relative z-20 border-t", o),
+      className: d("relative z-20 border-t", o),
       color: "default",
       sx: /* @__PURE__ */ t((m) => ({
         backgroundColor: "var(--default-background-footerTheme-palette)",
@@ -25,13 +24,13 @@ function s(e) {
         "--default-background-footerTheme-palette": r.palette.background.default
       }), "sx"),
       elevation: 0,
-      children: /* @__PURE__ */ a(d, { className: "min-h-48 md:min-h-64 px-8 sm:px-12 py-0 flex items-center overflow-x-auto", children: "Footer" })
+      children: /* @__PURE__ */ a(n, { className: "min-h-48 md:min-h-64 px-8 sm:px-12 py-0 flex items-center overflow-x-auto", children: "Footer" })
     }
   ) });
 }
-t(s, "FooterLayout");
-const N = u(s);
+t(u, "FooterLayout");
+const y = i(u);
 export {
-  N as default
+  y as default
 };
 //# sourceMappingURL=FooterLayout.js.map

package/dist/layout/components/layouts/FooterLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"FooterLayout.js","sources":["../../../../src/layout/components/layouts/FooterLayout.tsx"],"sourcesContent":["import { selectFooterTheme } from '@/store/owpSettingsSlice';\nimport { useAppSelector } from '@/hooks/useAppStore';\nimport AppBar from '@mui/material/AppBar';\nimport { ThemeProvider } from '@mui/material/styles';\nimport Toolbar from '@mui/material/Toolbar';\nimport clsx from 'clsx';\nimport { memo } from 'react';\n\ntype FooterLayoutProps = { className?: string };\n\n/**\n * The footer layout.\n */\nfunction FooterLayout(props: FooterLayoutProps) {\n  const { className } = props;\n\n  const footerTheme = useAppSelector(selectFooterTheme);\n\n  return (\n    <ThemeProvider theme={footerTheme}>\n      <AppBar\n        id=\"owp-footer\"\n        className={clsx('relative z-20 border-t', className)}\n        color=\"default\"\n        sx={(theme) => ({\n          backgroundColor: 'var(--default-background-footerTheme-palette)',\n          ...theme.applyStyles('light', {\n            backgroundColor: 'var(--paper-background-footerTheme-palette)',\n          }),\n          '--paper-background-footerTheme-palette': (footerTheme as any).palette.background.paper,\n          '--default-background-footerTheme-palette': (footerTheme as any).palette.background\n            .default,\n        })}\n        elevation={0}\n      >\n        <Toolbar className=\"min-h-48 md:min-h-64 px-8 sm:px-12 py-0 flex items-center overflow-x-auto\">\n          Footer\n        </Toolbar>\n      </AppBar>\n    </ThemeProvider>\n  );\n}\n\nexport default memo(FooterLayout);\n"],"names":["FooterLayout","props","className","footerTheme","useAppSelector","selectFooterTheme","jsx","ThemeProvider","AppBar","clsx","__name","theme","Toolbar","FooterLayout$1","memo"],"mappings":";;;;;;;;;;AAaA,SAASA,EAAaC,GAA0B;AAC9C,QAAM,EAAE,WAAAC,MAAcD,GAEhBE,IAAcC,EAAeC,CAAiB;AAEpD,SACE,gBAAAC,EAACC,GAAA,EAAc,OAAOJ,GACpB,UAAA,gBAAAG;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,IAAG;AAAA,MACH,WAAWC,EAAK,0BAA0BP,CAAS;AAAA,MACnD,OAAM;AAAA,MACN,IAAI,gBAAAQ,EAAA,CAACC,OAAW;AAAA,QACd,iBAAiB;AAAA,QACjB,GAAGA,EAAM,YAAY,SAAS;AAAA,UAC5B,iBAAiB;AAAA,QAAA,CAClB;AAAA,QACD,0CAA2CR,EAAoB,QAAQ,WAAW;AAAA,QAClF,4CAA6CA,EAAoB,QAAQ,WACtE;AAAA,MAAA,IAPD;AAAA,MASJ,WAAW;AAAA,MAEX,UAAA,gBAAAG,EAACM,GAAA,EAAQ,WAAU,6EAA4E,UAAA,SAAA,CAE/F;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;AA5BSF,EAAAV,GAAA;AA8BT,MAAAa,IAAeC,EAAKd,CAAY;"}
+{"version":3,"file":"FooterLayout.js","sources":["../../../../src/layout/components/layouts/FooterLayout.tsx"],"sourcesContent":["import { useGetFooterTheme } from '@/hooks/useOwpSettings';\nimport AppBar from '@mui/material/AppBar';\nimport { ThemeProvider } from '@mui/material/styles';\nimport Toolbar from '@mui/material/Toolbar';\nimport clsx from 'clsx';\nimport { memo } from 'react';\n\ntype FooterLayoutProps = { className?: string };\n\n/**\n * The footer layout.\n */\nfunction FooterLayout(props: FooterLayoutProps) {\n  const { className } = props;\n\n  const footerTheme = useGetFooterTheme();\n\n  return (\n    <ThemeProvider theme={footerTheme}>\n      <AppBar\n        id=\"owp-footer\"\n        className={clsx('relative z-20 border-t', className)}\n        color=\"default\"\n        sx={(theme) => ({\n          backgroundColor: 'var(--default-background-footerTheme-palette)',\n          ...theme.applyStyles('light', {\n            backgroundColor: 'var(--paper-background-footerTheme-palette)',\n          }),\n          '--paper-background-footerTheme-palette': (footerTheme as any).palette.background.paper,\n          '--default-background-footerTheme-palette': (footerTheme as any).palette.background\n            .default,\n        })}\n        elevation={0}\n      >\n        <Toolbar className=\"min-h-48 md:min-h-64 px-8 sm:px-12 py-0 flex items-center overflow-x-auto\">\n          Footer\n        </Toolbar>\n      </AppBar>\n    </ThemeProvider>\n  );\n}\n\nexport default memo(FooterLayout);\n"],"names":["FooterLayout","props","className","footerTheme","useGetFooterTheme","jsx","ThemeProvider","AppBar","clsx","__name","theme","Toolbar","FooterLayout$1","memo"],"mappings":";;;;;;;;;AAYA,SAASA,EAAaC,GAA0B;AAC9C,QAAM,EAAE,WAAAC,MAAcD,GAEhBE,IAAcC,EAAA;AAEpB,SACE,gBAAAC,EAACC,GAAA,EAAc,OAAOH,GACpB,UAAA,gBAAAE;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,IAAG;AAAA,MACH,WAAWC,EAAK,0BAA0BN,CAAS;AAAA,MACnD,OAAM;AAAA,MACN,IAAI,gBAAAO,EAAA,CAACC,OAAW;AAAA,QACd,iBAAiB;AAAA,QACjB,GAAGA,EAAM,YAAY,SAAS;AAAA,UAC5B,iBAAiB;AAAA,QAAA,CAClB;AAAA,QACD,0CAA2CP,EAAoB,QAAQ,WAAW;AAAA,QAClF,4CAA6CA,EAAoB,QAAQ,WACtE;AAAA,MAAA,IAPD;AAAA,MASJ,WAAW;AAAA,MAEX,UAAA,gBAAAE,EAACM,GAAA,EAAQ,WAAU,6EAA4E,UAAA,SAAA,CAE/F;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;AA5BSF,EAAAT,GAAA;AA8BT,MAAAY,IAAeC,EAAKb,CAAY;"}

package/dist/layout/components/layouts/NavbarToggleFabLayout.js

@@ -1,26 +1,29 @@
-var s = Object.defineProperty;
-var t = (o, r) => s(o, "name", { value: r, configurable: !0 });
-import { jsx as p } from "../../../node_modules/.pnpm/@emotion_react@11.14.0_@types_react@19.2.14_react@19.2.4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js";
-import { navbarToggleMobile as m, navbarToggle as c } from "../../../store/navbarSlice.js";
-import l from "../navbar/NavbarToggleFab.js";
-import { selectOwpCurrentLayoutConfig as g } from "../../../store/owpSettingsSlice.js";
-import { useThemeMediaQuery as b } from "../../../hooks/useThemeMediaQuery.js";
-import { useAppSelector as f, useAppDispatch as u } from "../../../hooks/useAppStore.js";
-function N(o) {
-  const { className: r } = o, e = b((n) => n.breakpoints.down("lg")), a = f(g), i = u();
-  return /* @__PURE__ */ p(
-    l,
+var m = Object.defineProperty;
+var r = (o, t) => m(o, "name", { value: t, configurable: !0 });
+import { jsx as g } from "../../../node_modules/.pnpm/@emotion_react@11.14.0_@types_react@19.2.14_react@19.2.4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js";
+import u from "../navbar/NavbarToggleFab.js";
+import { useNavbarActions as f } from "../../../hooks/useNavbar.js";
+import { useThemeMediaQuery as l } from "../../../hooks/useThemeMediaQuery.js";
+import { useGetCurrentLayoutConfig as b } from "../../../hooks/useOwpSettings.js";
+function C(o) {
+  const { className: t } = o, e = l((s) => s.breakpoints.down("lg")), i = b(), { toggle: a, toggleMobile: n } = f();
+  return /* @__PURE__ */ g(
+    u,
     {
-      className: r,
-      onClick: /* @__PURE__ */ t(() => {
-        i(e ? m() : c());
+      className: t,
+      onClick: /* @__PURE__ */ r(() => {
+        if (e) {
+          n();
+          return;
+        }
+        a();
       }, "onClick"),
-      position: a.navbar.position
+      position: i.navbar.position
     }
   );
 }
-t(N, "NavbarToggleFabLayout");
+r(C, "NavbarToggleFabLayout");
 export {
-  N as default
+  C as default
 };
 //# sourceMappingURL=NavbarToggleFabLayout.js.map

package/dist/layout/components/layouts/NavbarToggleFabLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavbarToggleFabLayout.js","sources":["../../../../src/layout/components/layouts/NavbarToggleFabLayout.tsx"],"sourcesContent":["import { LayoutConfigDefaultsType } from '@/configs/layoutConfig';\nimport {\n  navbarToggle,\n  navbarToggleMobile,\n} from '@/store/navbarSlice';\nimport NavbarToggleFab from '@/layout/components/navbar/NavbarToggleFab';\nimport { selectOwpCurrentLayoutConfig } from '@/store/owpSettingsSlice';\nimport { useThemeMediaQuery } from '@/hooks/useThemeMediaQuery';\nimport { useAppDispatch, useAppSelector } from '@/hooks/useAppStore';\n\ntype NavbarToggleFabLayoutProps = {\n  className?: string;\n};\n\n/**\n * The navbar toggle fab layout.\n */\nfunction NavbarToggleFabLayout(props: NavbarToggleFabLayoutProps) {\n  const { className } = props;\n\n  const isMobile = useThemeMediaQuery((theme) => theme.breakpoints.down('lg'));\n\n  const config = useAppSelector(selectOwpCurrentLayoutConfig) as LayoutConfigDefaultsType;\n\n  const dispatch = useAppDispatch();\n\n  return (\n    <NavbarToggleFab\n      className={className}\n      onClick={() => {\n        dispatch(isMobile ? navbarToggleMobile() : navbarToggle());\n      }}\n      position={config.navbar.position}\n    />\n  );\n}\n\nexport default NavbarToggleFabLayout;\n"],"names":["NavbarToggleFabLayout","props","className","isMobile","useThemeMediaQuery","theme","config","useAppSelector","selectOwpCurrentLayoutConfig","dispatch","useAppDispatch","jsx","NavbarToggleFab","__name","navbarToggleMobile","navbarToggle"],"mappings":";;;;;;;;AAiBA,SAASA,EAAsBC,GAAmC;AAChE,QAAM,EAAE,WAAAC,MAAcD,GAEhBE,IAAWC,EAAmB,CAACC,MAAUA,EAAM,YAAY,KAAK,IAAI,CAAC,GAErEC,IAASC,EAAeC,CAA4B,GAEpDC,IAAWC,EAAA;AAEjB,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAAV;AAAA,MACA,SAAS,gBAAAW,EAAA,MAAM;AACb,QAAAJ,EAASN,IAAWW,EAAA,IAAuBC,EAAA,CAAc;AAAA,MAC3D,GAFS;AAAA,MAGT,UAAUT,EAAO,OAAO;AAAA,IAAA;AAAA,EAAA;AAG9B;AAlBSO,EAAAb,GAAA;"}
+{"version":3,"file":"NavbarToggleFabLayout.js","sources":["../../../../src/layout/components/layouts/NavbarToggleFabLayout.tsx"],"sourcesContent":["import { LayoutConfigDefaultsType } from '@/configs/layoutConfig';\nimport NavbarToggleFab from '@/layout/components/navbar/NavbarToggleFab';\nimport { useNavbarActions } from '@/hooks/useNavbar';\nimport { useThemeMediaQuery } from '@/hooks/useThemeMediaQuery';\nimport { useGetCurrentLayoutConfig } from '@/hooks/useOwpSettings';\n\ntype NavbarToggleFabLayoutProps = {\n  className?: string;\n};\n\n/**\n * The navbar toggle fab layout.\n */\nfunction NavbarToggleFabLayout(props: NavbarToggleFabLayoutProps) {\n  const { className } = props;\n\n  const isMobile = useThemeMediaQuery((theme) => theme.breakpoints.down('lg'));\n\n  const config = useGetCurrentLayoutConfig() as LayoutConfigDefaultsType;\n  const { toggle, toggleMobile } = useNavbarActions();\n\n  return (\n    <NavbarToggleFab\n      className={className}\n      onClick={() => {\n        if (isMobile) {\n          toggleMobile();\n          return;\n        }\n\n        toggle();\n      }}\n      position={config.navbar.position}\n    />\n  );\n}\n\nexport default NavbarToggleFabLayout;\n"],"names":["NavbarToggleFabLayout","props","className","isMobile","useThemeMediaQuery","theme","config","useGetCurrentLayoutConfig","toggle","toggleMobile","useNavbarActions","jsx","NavbarToggleFab","__name"],"mappings":";;;;;;;AAaA,SAASA,EAAsBC,GAAmC;AAChE,QAAM,EAAE,WAAAC,MAAcD,GAEhBE,IAAWC,EAAmB,CAACC,MAAUA,EAAM,YAAY,KAAK,IAAI,CAAC,GAErEC,IAASC,EAAA,GACT,EAAE,QAAAC,GAAQ,cAAAC,EAAA,IAAiBC,EAAA;AAEjC,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAAV;AAAA,MACA,SAAS,gBAAAW,EAAA,MAAM;AACb,YAAIV,GAAU;AACZ,UAAAM,EAAA;AACA;AAAA,QACF;AAEA,QAAAD,EAAA;AAAA,MACF,GAPS;AAAA,MAQT,UAAUF,EAAO,OAAO;AAAA,IAAA;AAAA,EAAA;AAG9B;AAtBSO,EAAAb,GAAA;"}

package/dist/layout/components/layouts/NavbarWrapperLayout.js

@@ -1,28 +1,27 @@
-var f = Object.defineProperty;
-var i = (o, r) => f(o, "name", { value: r, configurable: !0 });
-import { jsxs as l, jsx as e, Fragment as b } from "../../../node_modules/.pnpm/@emotion_react@11.14.0_@types_react@19.2.14_react@19.2.4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js";
-import { selectOwpCurrentLayoutConfig as u, selectNavbarTheme as h } from "../../../store/owpSettingsSlice.js";
+var c = Object.defineProperty;
+var i = (o, r) => c(o, "name", { value: r, configurable: !0 });
+import { jsxs as f, jsx as e, Fragment as u } from "../../../node_modules/.pnpm/@emotion_react@11.14.0_@types_react@19.2.14_react@19.2.4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js";
+import { useGetCurrentLayoutConfig as b, useGetNavbarTheme as l } from "../../../hooks/useOwpSettings.js";
 import v from "./NavbarToggleFabLayout.js";
-import { selectOwpNavbar as d, navbarCloseMobile as y } from "../../../store/navbarSlice.js";
-import { useThemeMediaQuery as g } from "../../../hooks/useThemeMediaQuery.js";
-import { useAppSelector as t, useAppDispatch as N } from "../../../hooks/useAppStore.js";
-import { ThemeProvider as T } from "@mui/material/styles";
-import { useEffect as L } from "react";
-import { useLocation as w } from "react-router-dom";
-import x from "../navbar/style/NavbarStyle.js";
-function Q() {
-  const o = t(u), r = t(d), m = w(), a = g((c) => c.breakpoints.down("lg")), { pathname: n } = m, p = N();
-  L(() => {
-    a && p(y());
-  }, [n, a]);
-  const s = t(h);
-  return /* @__PURE__ */ l(b, { children: [
-    /* @__PURE__ */ e(T, { theme: s, children: /* @__PURE__ */ e(x, {}) }),
+import { useGetNavbar as d, useNavbarActions as h } from "../../../hooks/useNavbar.js";
+import { useThemeMediaQuery as y } from "../../../hooks/useThemeMediaQuery.js";
+import { ThemeProvider as g } from "@mui/material/styles";
+import { useEffect as N } from "react";
+import { useLocation as T } from "react-router-dom";
+import L from "../navbar/style/NavbarStyle.js";
+function P() {
+  const o = b(), r = d(), n = T(), t = y((p) => p.breakpoints.down("lg")), { pathname: m } = n, { closeMobile: a } = h();
+  N(() => {
+    t && a();
+  }, [a, m, t]);
+  const s = l();
+  return /* @__PURE__ */ f(u, { children: [
+    /* @__PURE__ */ e(g, { theme: s, children: /* @__PURE__ */ e(L, {}) }),
     o.navbar.display && !o.toolbar.display && !r.open && /* @__PURE__ */ e(v, {})
   ] });
 }
-i(Q, "NavbarWrapperLayout");
+i(P, "NavbarWrapperLayout");
 export {
-  Q as default
+  P as default
 };
 //# sourceMappingURL=NavbarWrapperLayout.js.map

package/dist/layout/components/layouts/NavbarWrapperLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavbarWrapperLayout.js","sources":["../../../../src/layout/components/layouts/NavbarWrapperLayout.tsx"],"sourcesContent":["import {\n  selectNavbarTheme,\n  selectOwpCurrentLayoutConfig,\n} from '@/store/owpSettingsSlice';\nimport { LayoutConfigDefaultsType } from '@/configs/layoutConfig';\nimport NavbarToggleFabLayout from '@/layout/components/layouts/NavbarToggleFabLayout';\nimport {\n  navbarCloseMobile,\n  selectOwpNavbar,\n} from '@/store/navbarSlice';\nimport { useThemeMediaQuery } from '@/hooks/useThemeMediaQuery';\nimport { useAppDispatch, useAppSelector } from '@/hooks/useAppStore';\nimport { ThemeProvider } from '@mui/material/styles';\nimport { useEffect } from 'react';\nimport { useLocation } from 'react-router-dom';\nimport NavbarStyle from '../navbar/style/NavbarStyle';\n\n/**\n * The navbar wrapper layout.\n */\nfunction NavbarWrapperLayout() {\n  const config = useAppSelector(selectOwpCurrentLayoutConfig) as LayoutConfigDefaultsType;\n  const navbar = useAppSelector(selectOwpNavbar);\n  const location = useLocation();\n  const isMobile = useThemeMediaQuery((theme) => theme.breakpoints.down('lg'));\n  const { pathname } = location;\n  const dispatch = useAppDispatch();\n\n  useEffect(() => {\n    if (isMobile) {\n      dispatch(navbarCloseMobile());\n    }\n  }, [pathname, isMobile]);\n\n  const navbarTheme = useAppSelector(selectNavbarTheme);\n\n  return (\n    <>\n      <ThemeProvider theme={navbarTheme}>\n        <NavbarStyle />\n      </ThemeProvider>\n      {config.navbar.display && !config.toolbar.display && !navbar.open && (\n        <NavbarToggleFabLayout />\n      )}\n    </>\n  );\n}\n\nexport default NavbarWrapperLayout;\n"],"names":["NavbarWrapperLayout","config","useAppSelector","selectOwpCurrentLayoutConfig","navbar","selectOwpNavbar","location","useLocation","isMobile","useThemeMediaQuery","theme","pathname","dispatch","useAppDispatch","useEffect","navbarCloseMobile","navbarTheme","selectNavbarTheme","jsxs","Fragment","jsx","ThemeProvider","NavbarStyle","NavbarToggleFabLayout","__name"],"mappings":";;;;;;;;;;;;AAoBA,SAASA,IAAsB;AAC7B,QAAMC,IAASC,EAAeC,CAA4B,GACpDC,IAASF,EAAeG,CAAe,GACvCC,IAAWC,EAAA,GACXC,IAAWC,EAAmB,CAACC,MAAUA,EAAM,YAAY,KAAK,IAAI,CAAC,GACrE,EAAE,UAAAC,MAAaL,GACfM,IAAWC,EAAA;AAEjB,EAAAC,EAAU,MAAM;AACd,IAAIN,KACFI,EAASG,GAAmB;AAAA,EAEhC,GAAG,CAACJ,GAAUH,CAAQ,CAAC;AAEvB,QAAMQ,IAAcd,EAAee,CAAiB;AAEpD,SACE,gBAAAC,EAAAC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EAAc,OAAOL,GACpB,UAAA,gBAAAI,EAACE,KAAY,GACf;AAAA,IACCrB,EAAO,OAAO,WAAW,CAACA,EAAO,QAAQ,WAAW,CAACG,EAAO,QAC3D,gBAAAgB,EAACG,GAAA,CAAA,CAAsB;AAAA,EAAA,GAE3B;AAEJ;AA1BSC,EAAAxB,GAAA;"}
+{"version":3,"file":"NavbarWrapperLayout.js","sources":["../../../../src/layout/components/layouts/NavbarWrapperLayout.tsx"],"sourcesContent":["import {\n  useGetCurrentLayoutConfig,\n  useGetNavbarTheme,\n} from '@/hooks/useOwpSettings';\nimport { LayoutConfigDefaultsType } from '@/configs/layoutConfig';\nimport NavbarToggleFabLayout from '@/layout/components/layouts/NavbarToggleFabLayout';\nimport { useGetNavbar, useNavbarActions } from '@/hooks/useNavbar';\nimport { useThemeMediaQuery } from '@/hooks/useThemeMediaQuery';\nimport { ThemeProvider } from '@mui/material/styles';\nimport { useEffect } from 'react';\nimport { useLocation } from 'react-router-dom';\nimport NavbarStyle from '../navbar/style/NavbarStyle';\n\n/**\n * The navbar wrapper layout.\n */\nfunction NavbarWrapperLayout() {\n  const config = useGetCurrentLayoutConfig() as LayoutConfigDefaultsType;\n  const navbar = useGetNavbar();\n  const location = useLocation();\n  const isMobile = useThemeMediaQuery((theme) => theme.breakpoints.down('lg'));\n  const { pathname } = location;\n  const { closeMobile } = useNavbarActions();\n\n  useEffect(() => {\n    if (isMobile) {\n      closeMobile();\n    }\n  }, [closeMobile, pathname, isMobile]);\n\n  const navbarTheme = useGetNavbarTheme();\n\n  return (\n    <>\n      <ThemeProvider theme={navbarTheme}>\n        <NavbarStyle />\n      </ThemeProvider>\n      {config.navbar.display && !config.toolbar.display && !navbar.open && (\n        <NavbarToggleFabLayout />\n      )}\n    </>\n  );\n}\n\nexport default NavbarWrapperLayout;\n"],"names":["NavbarWrapperLayout","config","useGetCurrentLayoutConfig","navbar","useGetNavbar","location","useLocation","isMobile","useThemeMediaQuery","theme","pathname","closeMobile","useNavbarActions","useEffect","navbarTheme","useGetNavbarTheme","jsxs","Fragment","jsx","ThemeProvider","NavbarStyle","NavbarToggleFabLayout","__name"],"mappings":";;;;;;;;;;;AAgBA,SAASA,IAAsB;AAC7B,QAAMC,IAASC,EAAA,GACTC,IAASC,EAAA,GACTC,IAAWC,EAAA,GACXC,IAAWC,EAAmB,CAACC,MAAUA,EAAM,YAAY,KAAK,IAAI,CAAC,GACrE,EAAE,UAAAC,MAAaL,GACf,EAAE,aAAAM,EAAA,IAAgBC,EAAA;AAExB,EAAAC,EAAU,MAAM;AACd,IAAIN,KACFI,EAAA;AAAA,EAEJ,GAAG,CAACA,GAAaD,GAAUH,CAAQ,CAAC;AAEpC,QAAMO,IAAcC,EAAA;AAEpB,SACE,gBAAAC,EAAAC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EAAc,OAAOL,GACpB,UAAA,gBAAAI,EAACE,KAAY,GACf;AAAA,IACCnB,EAAO,OAAO,WAAW,CAACA,EAAO,QAAQ,WAAW,CAACE,EAAO,QAC3D,gBAAAe,EAACG,GAAA,CAAA,CAAsB;AAAA,EAAA,GAE3B;AAEJ;AA1BSC,EAAAtB,GAAA;"}

package/dist/layout/components/navbar/NavbarPinToggleButton.js

@@ -2,12 +2,11 @@ var u = Object.defineProperty;
 var r = (o, n) => u(o, "name", { value: n, configurable: !0 });
 import { jsx as t } from "../../../node_modules/.pnpm/@emotion_react@11.14.0_@types_react@19.2.14_react@19.2.4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js";
 import d from "./NavbarToggleButton.js";
-import { useOwpTranslation as p } from "../../../hooks/useOwpTranslation.js";
-import { useAppSelector as h } from "../../../hooks/useAppStore.js";
-import { selectOwpCurrentSettings as m } from "../../../store/owpSettingsSlice.js";
+import { useOwpTranslation as h } from "../../../hooks/useOwpTranslation.js";
+import { useGetCurrentSettings as p } from "../../../hooks/useOwpSettings.js";
 import l from "@mui/material/SvgIcon";
-import { clsx as g } from "../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js";
-function k(o) {
+import { clsx as m } from "../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js";
+function g(o) {
   return /* @__PURE__ */ t(l, { ...o, viewBox: "0 0 24 24", children: /* @__PURE__ */ t(
     "path",
     {
@@ -21,8 +20,8 @@ function k(o) {
     }
   ) });
 }
-r(k, "NavbarAutoHideIcon");
-function v(o) {
+r(g, "NavbarAutoHideIcon");
+function k(o) {
   return /* @__PURE__ */ t(l, { ...o, viewBox: "0 0 24 24", children: /* @__PURE__ */ t(
     "path",
     {
@@ -36,18 +35,18 @@ function v(o) {
     }
   ) });
 }
-r(v, "NavbarPinnedIcon");
+r(k, "NavbarPinnedIcon");
 function L(o) {
   var s;
-  const { children: n, ...e } = o, a = h(m), { config: f } = a.layout, i = (s = f.navbar) == null ? void 0 : s.folded, { t: c } = p();
+  const { children: n, ...e } = o, a = p(), { config: f } = a.layout, i = (s = f.navbar) == null ? void 0 : s.folded, { t: c } = h();
   return /* @__PURE__ */ t(
     d,
     {
       ...e,
       color: e.color ?? "inherit",
       tooltipTitle: c(i ? "Title.네비게이션 고정" : "Title.네비게이션 자동 숨김"),
-      className: g(i ? "opacity-100" : "opacity-70", e.className),
-      children: n ?? (i ? /* @__PURE__ */ t(v, { color: "inherit", sx: { fontSize: 24 } }) : /* @__PURE__ */ t(k, { color: "inherit", sx: { fontSize: 24 } }))
+      className: m(i ? "opacity-100" : "opacity-70", e.className),
+      children: n ?? (i ? /* @__PURE__ */ t(k, { color: "inherit", sx: { fontSize: 24 } }) : /* @__PURE__ */ t(g, { color: "inherit", sx: { fontSize: 24 } }))
     }
   );
 }

package/dist/layout/components/navbar/NavbarPinToggleButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavbarPinToggleButton.js","sources":["../../../../src/layout/components/navbar/NavbarPinToggleButton.tsx"],"sourcesContent":["import NavbarToggleButton, {\n  NavbarToggleButtonProps,\n} from '@/layout/components/navbar/NavbarToggleButton';\nimport { useOwpTranslation } from '@/hooks/useOwpTranslation';\nimport { useAppSelector } from '@/hooks/useAppStore';\nimport { selectOwpCurrentSettings as selectCurrentSettings } from '@/store/owpSettingsSlice';\nimport type { OwpSettingsConfigType as SettingsConfigType } from '@/types/OwpSettingsTypes';\nimport SvgIcon, { type SvgIconProps } from '@mui/material/SvgIcon';\nimport clsx from 'clsx';\nimport type { ReactNode } from 'react';\n\ntype NavbarPinToggleButtonProps = NavbarToggleButtonProps & {\n  className?: string;\n  children?: ReactNode;\n};\n\n/**\n * Navbar auto-hide state icon.\n */\nfunction NavbarAutoHideIcon(props: SvgIconProps) {\n  return (\n    <SvgIcon {...props} viewBox=\"0 0 24 24\">\n      <path\n        d=\"M4 6.5h16M4 12h16M4 17.5h16\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        strokeWidth={1}\n        vectorEffect=\"non-scaling-stroke\"\n      />\n    </SvgIcon>\n  );\n}\n\n/**\n * Navbar pinned state icon.\n */\nfunction NavbarPinnedIcon(props: SvgIconProps) {\n  return (\n    <SvgIcon {...props} viewBox=\"0 0 24 24\">\n      <path\n        d=\"M4 6.5h11.5M4 12h8.5M4 17.5h11.5M18.75 8.5 15.25 12l3.5 3.5\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        strokeWidth={1}\n        vectorEffect=\"non-scaling-stroke\"\n      />\n    </SvgIcon>\n  );\n}\n\n/**\n * Navbar pin toggle button.\n */\nfunction NavbarPinToggleButton(props: NavbarPinToggleButtonProps) {\n  const { children, ...rest } = props;\n  const settings: SettingsConfigType = useAppSelector(selectCurrentSettings);\n  const { config } = settings.layout;\n  const folded = config.navbar?.folded;\n  const { t } = useOwpTranslation();\n\n  return (\n    <NavbarToggleButton\n      {...rest}\n      color={rest.color ?? 'inherit'}\n      tooltipTitle={\n        folded ? t('Title.네비게이션 고정') : t('Title.네비게이션 자동 숨김')\n      }\n      className={clsx(folded ? 'opacity-100' : 'opacity-70', rest.className)}\n    >\n      {children ??\n        (folded ? (\n          <NavbarPinnedIcon color=\"inherit\" sx={{ fontSize: 24 }} />\n        ) : (\n          <NavbarAutoHideIcon color=\"inherit\" sx={{ fontSize: 24 }} />\n        ))}\n    </NavbarToggleButton>\n  );\n}\n\nexport default NavbarPinToggleButton;\n"],"names":["NavbarAutoHideIcon","props","jsx","SvgIcon","__name","NavbarPinnedIcon","NavbarPinToggleButton","children","rest","settings","useAppSelector","selectCurrentSettings","config","folded","_a","t","useOwpTranslation","NavbarToggleButton","clsx"],"mappings":";;;;;;;;;AAmBA,SAASA,EAAmBC,GAAqB;AAC/C,SACE,gBAAAC,EAACC,GAAA,EAAS,GAAGF,GAAO,SAAQ,aAC1B,UAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,GAAE;AAAA,MACF,MAAK;AAAA,MACL,QAAO;AAAA,MACP,eAAc;AAAA,MACd,gBAAe;AAAA,MACf,aAAa;AAAA,MACb,cAAa;AAAA,IAAA;AAAA,EAAA,GAEjB;AAEJ;AAdSE,EAAAJ,GAAA;AAmBT,SAASK,EAAiBJ,GAAqB;AAC7C,SACE,gBAAAC,EAACC,GAAA,EAAS,GAAGF,GAAO,SAAQ,aAC1B,UAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,GAAE;AAAA,MACF,MAAK;AAAA,MACL,QAAO;AAAA,MACP,eAAc;AAAA,MACd,gBAAe;AAAA,MACf,aAAa;AAAA,MACb,cAAa;AAAA,IAAA;AAAA,EAAA,GAEjB;AAEJ;AAdSE,EAAAC,GAAA;AAmBT,SAASC,EAAsBL,GAAmC;;AAChE,QAAM,EAAE,UAAAM,GAAU,GAAGC,EAAA,IAASP,GACxBQ,IAA+BC,EAAeC,CAAqB,GACnE,EAAE,QAAAC,MAAWH,EAAS,QACtBI,KAASC,IAAAF,EAAO,WAAP,gBAAAE,EAAe,QACxB,EAAE,GAAAC,EAAA,IAAMC,EAAA;AAEd,SACE,gBAAAd;AAAA,IAACe;AAAA,IAAA;AAAA,MACE,GAAGT;AAAA,MACJ,OAAOA,EAAK,SAAS;AAAA,MACrB,cACWO,EAATF,IAAW,mBAAsB,mBAAN;AAAA,MAE7B,WAAWK,EAAKL,IAAS,gBAAgB,cAAcL,EAAK,SAAS;AAAA,MAEpE,UAAAD,MACEM,IACC,gBAAAX,EAACG,GAAA,EAAiB,OAAM,WAAU,IAAI,EAAE,UAAU,GAAA,GAAM,IAExD,gBAAAH,EAACF,KAAmB,OAAM,WAAU,IAAI,EAAE,UAAU,MAAM;AAAA,IAAA;AAAA,EAAA;AAIpE;AAxBSI,EAAAE,GAAA;"}
+{"version":3,"file":"NavbarPinToggleButton.js","sources":["../../../../src/layout/components/navbar/NavbarPinToggleButton.tsx"],"sourcesContent":["import NavbarToggleButton, {\n  NavbarToggleButtonProps,\n} from '@/layout/components/navbar/NavbarToggleButton';\nimport { useOwpTranslation } from '@/hooks/useOwpTranslation';\nimport { useGetCurrentSettings } from '@/hooks/useOwpSettings';\nimport type { OwpSettingsConfigType as SettingsConfigType } from '@/types/OwpSettingsTypes';\nimport SvgIcon, { type SvgIconProps } from '@mui/material/SvgIcon';\nimport clsx from 'clsx';\nimport type { ReactNode } from 'react';\n\ntype NavbarPinToggleButtonProps = NavbarToggleButtonProps & {\n  className?: string;\n  children?: ReactNode;\n};\n\n/**\n * Navbar auto-hide state icon.\n */\nfunction NavbarAutoHideIcon(props: SvgIconProps) {\n  return (\n    <SvgIcon {...props} viewBox=\"0 0 24 24\">\n      <path\n        d=\"M4 6.5h16M4 12h16M4 17.5h16\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        strokeWidth={1}\n        vectorEffect=\"non-scaling-stroke\"\n      />\n    </SvgIcon>\n  );\n}\n\n/**\n * Navbar pinned state icon.\n */\nfunction NavbarPinnedIcon(props: SvgIconProps) {\n  return (\n    <SvgIcon {...props} viewBox=\"0 0 24 24\">\n      <path\n        d=\"M4 6.5h11.5M4 12h8.5M4 17.5h11.5M18.75 8.5 15.25 12l3.5 3.5\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        strokeWidth={1}\n        vectorEffect=\"non-scaling-stroke\"\n      />\n    </SvgIcon>\n  );\n}\n\n/**\n * Navbar pin toggle button.\n */\nfunction NavbarPinToggleButton(props: NavbarPinToggleButtonProps) {\n  const { children, ...rest } = props;\n  const settings: SettingsConfigType = useGetCurrentSettings();\n  const { config } = settings.layout;\n  const folded = config.navbar?.folded;\n  const { t } = useOwpTranslation();\n\n  return (\n    <NavbarToggleButton\n      {...rest}\n      color={rest.color ?? 'inherit'}\n      tooltipTitle={\n        folded ? t('Title.네비게이션 고정') : t('Title.네비게이션 자동 숨김')\n      }\n      className={clsx(folded ? 'opacity-100' : 'opacity-70', rest.className)}\n    >\n      {children ??\n        (folded ? (\n          <NavbarPinnedIcon color=\"inherit\" sx={{ fontSize: 24 }} />\n        ) : (\n          <NavbarAutoHideIcon color=\"inherit\" sx={{ fontSize: 24 }} />\n        ))}\n    </NavbarToggleButton>\n  );\n}\n\nexport default NavbarPinToggleButton;\n"],"names":["NavbarAutoHideIcon","props","jsx","SvgIcon","__name","NavbarPinnedIcon","NavbarPinToggleButton","children","rest","settings","useGetCurrentSettings","config","folded","_a","t","useOwpTranslation","NavbarToggleButton","clsx"],"mappings":";;;;;;;;AAkBA,SAASA,EAAmBC,GAAqB;AAC/C,SACE,gBAAAC,EAACC,GAAA,EAAS,GAAGF,GAAO,SAAQ,aAC1B,UAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,GAAE;AAAA,MACF,MAAK;AAAA,MACL,QAAO;AAAA,MACP,eAAc;AAAA,MACd,gBAAe;AAAA,MACf,aAAa;AAAA,MACb,cAAa;AAAA,IAAA;AAAA,EAAA,GAEjB;AAEJ;AAdSE,EAAAJ,GAAA;AAmBT,SAASK,EAAiBJ,GAAqB;AAC7C,SACE,gBAAAC,EAACC,GAAA,EAAS,GAAGF,GAAO,SAAQ,aAC1B,UAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,GAAE;AAAA,MACF,MAAK;AAAA,MACL,QAAO;AAAA,MACP,eAAc;AAAA,MACd,gBAAe;AAAA,MACf,aAAa;AAAA,MACb,cAAa;AAAA,IAAA;AAAA,EAAA,GAEjB;AAEJ;AAdSE,EAAAC,GAAA;AAmBT,SAASC,EAAsBL,GAAmC;;AAChE,QAAM,EAAE,UAAAM,GAAU,GAAGC,EAAA,IAASP,GACxBQ,IAA+BC,EAAA,GAC/B,EAAE,QAAAC,MAAWF,EAAS,QACtBG,KAASC,IAAAF,EAAO,WAAP,gBAAAE,EAAe,QACxB,EAAE,GAAAC,EAAA,IAAMC,EAAA;AAEd,SACE,gBAAAb;AAAA,IAACc;AAAA,IAAA;AAAA,MACE,GAAGR;AAAA,MACJ,OAAOA,EAAK,SAAS;AAAA,MACrB,cACWM,EAATF,IAAW,mBAAsB,mBAAN;AAAA,MAE7B,WAAWK,EAAKL,IAAS,gBAAgB,cAAcJ,EAAK,SAAS;AAAA,MAEpE,UAAAD,MACEK,IACC,gBAAAV,EAACG,GAAA,EAAiB,OAAM,WAAU,IAAI,EAAE,UAAU,GAAA,GAAM,IAExD,gBAAAH,EAACF,KAAmB,OAAM,WAAU,IAAI,EAAE,UAAU,MAAM;AAAA,IAAA;AAAA,EAAA;AAIpE;AAxBSI,EAAAE,GAAA;"}

package/dist/layout/components/navbar/NavbarToggleButton.js

@@ -1,60 +1,59 @@
 var T = Object.defineProperty;
 var a = (o, i) => T(o, "name", { value: i, configurable: !0 });
-import { jsx as n } from "../../../node_modules/.pnpm/@emotion_react@11.14.0_@types_react@19.2.14_react@19.2.4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js";
-import { selectOwpCurrentSettings as S, setDefaultSettings as v } from "../../../store/owpSettingsSlice.js";
+import { jsx as l } from "../../../node_modules/.pnpm/@emotion_react@11.14.0_@types_react@19.2.14_react@19.2.4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js";
+import { useNavbarActions as v } from "../../../hooks/useNavbar.js";
 import { useOwpTranslation as w } from "../../../hooks/useOwpTranslation.js";
 import { useThemeMediaQuery as C } from "../../../hooks/useThemeMediaQuery.js";
-import { useAppDispatch as h, useAppSelector as A } from "../../../hooks/useAppStore.js";
-import { navbarToggleMobile as B } from "../../../store/navbarSlice.js";
-import M from "@mui/material/IconButton";
-import N from "@mui/material/Tooltip";
-import { alpha as r } from "@mui/material/styles";
-import { clsx as O } from "../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js";
+import { useSetDefaultSettings as N, useGetCurrentSettings as A } from "../../../hooks/useOwpSettings.js";
+import B from "@mui/material/IconButton";
+import M from "@mui/material/Tooltip";
+import { alpha as t } from "@mui/material/styles";
+import { clsx as h } from "../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js";
 import { OwpSvgIcon as D } from "../../../components/OwpSvgIcon/OwpSvgIcon.js";
 import { set as I } from "../../../node_modules/.pnpm/es-toolkit@1.39.10/node_modules/es-toolkit/dist/compat/object/set.js";
-const j = /* @__PURE__ */ a((o) => ({
+const O = /* @__PURE__ */ a((o) => ({
   borderWidth: "1px",
   borderStyle: "solid",
-  borderColor: r(o.palette.text.primary, o.palette.mode === "dark" ? 0.32 : 0.16),
-  backgroundColor: r(o.palette.common.white, o.palette.mode === "dark" ? 0.08 : 0.9),
-  boxShadow: `inset 0 1px 0 ${r(o.palette.common.white, o.palette.mode === "dark" ? 0.08 : 0.88)}`,
-  color: r(o.palette.text.primary, o.palette.mode === "dark" ? 0.92 : 0.72),
+  borderColor: t(o.palette.text.primary, o.palette.mode === "dark" ? 0.32 : 0.16),
+  backgroundColor: t(o.palette.common.white, o.palette.mode === "dark" ? 0.08 : 0.9),
+  boxShadow: `inset 0 1px 0 ${t(o.palette.common.white, o.palette.mode === "dark" ? 0.08 : 0.88)}`,
+  color: t(o.palette.text.primary, o.palette.mode === "dark" ? 0.92 : 0.72),
   transition: o.transitions.create(["background-color", "border-color", "transform"], {
     duration: o.transitions.duration.shorter
   }),
   "&:hover": {
-    backgroundColor: r(o.palette.primary.main, o.palette.mode === "dark" ? 0.18 : 0.08),
-    borderColor: r(o.palette.primary.main, o.palette.mode === "dark" ? 0.4 : 0.22),
+    backgroundColor: t(o.palette.primary.main, o.palette.mode === "dark" ? 0.18 : 0.08),
+    borderColor: t(o.palette.primary.main, o.palette.mode === "dark" ? 0.4 : 0.22),
     transform: "translateY(-1px)"
   }
 }), "lightSurfaceButtonSx");
-function P(o) {
+function K(o) {
   const {
     className: i = "",
-    children: d = /* @__PURE__ */ n(D, { size: 20, color: "action", children: "heroicons-outline:bars-3" }),
-    surfaceTone: m = "inherit",
-    tooltipTitle: f,
-    sx: t,
+    children: c = /* @__PURE__ */ l(D, { size: 20, color: "action", children: "heroicons-outline:bars-3" }),
+    surfaceTone: d = "inherit",
+    tooltipTitle: m,
+    sx: r,
     ...u
-  } = o, s = h(), b = C((e) => e.breakpoints.down("lg")), { t: g } = w(), l = A(S), x = f ?? g("Title.메뉴"), k = m === "light" ? [j, ...Array.isArray(t) ? t : t ? [t] : []] : t, y = /* @__PURE__ */ n(
-    M,
+  } = o, f = C((e) => e.breakpoints.down("lg")), { t: b } = w(), { toggleMobile: g } = v(), x = N(), n = A(), k = m ?? b("Title.메뉴"), y = d === "light" ? [O, ...Array.isArray(r) ? r : r ? [r] : []] : r, S = /* @__PURE__ */ l(
+    B,
     {
       onClick: /* @__PURE__ */ a(() => {
-        var e, p, c;
-        s(b ? B() : v(
-          I({}, "layout.config.navbar.folded", !((c = (p = (e = l == null ? void 0 : l.layout) == null ? void 0 : e.config) == null ? void 0 : p.navbar) != null && c.folded))
-        ));
+        var e, s, p;
+        f ? g() : x(
+          I({}, "layout.config.navbar.folded", !((p = (s = (e = n == null ? void 0 : n.layout) == null ? void 0 : e.config) == null ? void 0 : s.navbar) != null && p.folded))
+        );
       }, "onClick"),
       ...u,
-      sx: k,
-      className: O(i),
-      children: d
+      sx: y,
+      className: h(i),
+      children: c
     }
   );
-  return /* @__PURE__ */ n(N, { title: x, placement: "bottom", children: y });
+  return /* @__PURE__ */ l(M, { title: k, placement: "bottom", children: S });
 }
-a(P, "NavbarToggleButton");
+a(K, "NavbarToggleButton");
 export {
-  P as default
+  K as default
 };
 //# sourceMappingURL=NavbarToggleButton.js.map

package/dist/layout/components/navbar/NavbarToggleButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavbarToggleButton.js","sources":["../../../../src/layout/components/navbar/NavbarToggleButton.tsx"],"sourcesContent":["import type { OwpSettingsConfigType as SettingsConfigType } from '@/types/OwpSettingsTypes';\nimport {\n  selectOwpCurrentSettings as selectCurrentSettings,\n  setDefaultSettings,\n} from '@/store/owpSettingsSlice';\nimport { OwpSvgIcon as SvgIcon } from '@/components/OwpSvgIcon';\nimport { useOwpTranslation } from '@/hooks/useOwpTranslation';\nimport { useThemeMediaQuery } from '@/hooks/useThemeMediaQuery';\nimport { useAppDispatch, useAppSelector } from '@/hooks/useAppStore';\nimport { navbarToggleMobile } from '@/store/navbarSlice';\nimport IconButton, { type IconButtonProps } from '@mui/material/IconButton';\nimport Tooltip from '@mui/material/Tooltip';\nimport { alpha, type SxProps, type Theme } from '@mui/material/styles';\nimport clsx from 'clsx';\nimport { set } from 'es-toolkit/compat';\nimport { ReactNode } from 'react';\n\nexport type NavbarToggleButtonProps = IconButtonProps & {\n  surfaceTone?: 'inherit' | 'light';\n  tooltipTitle?: ReactNode;\n};\n\nconst lightSurfaceButtonSx = (theme: Theme) => ({\n  borderWidth: '1px',\n  borderStyle: 'solid',\n  borderColor: alpha(theme.palette.text.primary, theme.palette.mode === 'dark' ? 0.32 : 0.16),\n  backgroundColor: alpha(theme.palette.common.white, theme.palette.mode === 'dark' ? 0.08 : 0.9),\n  boxShadow: `inset 0 1px 0 ${alpha(theme.palette.common.white, theme.palette.mode === 'dark' ? 0.08 : 0.88)}`,\n  color: alpha(theme.palette.text.primary, theme.palette.mode === 'dark' ? 0.92 : 0.72),\n  transition: theme.transitions.create(['background-color', 'border-color', 'transform'], {\n    duration: theme.transitions.duration.shorter,\n  }),\n  '&:hover': {\n    backgroundColor: alpha(theme.palette.primary.main, theme.palette.mode === 'dark' ? 0.18 : 0.08),\n    borderColor: alpha(theme.palette.primary.main, theme.palette.mode === 'dark' ? 0.4 : 0.22),\n    transform: 'translateY(-1px)',\n  },\n});\n\n/**\n * The navbar toggle button.\n */\nfunction NavbarToggleButton(props: NavbarToggleButtonProps) {\n  const {\n    className = '',\n    children = (\n      <SvgIcon size={20} color=\"action\">\n        heroicons-outline:bars-3\n      </SvgIcon>\n    ),\n    surfaceTone = 'inherit',\n    tooltipTitle,\n    sx,\n    ...rest\n  } = props;\n\n  const dispatch = useAppDispatch();\n  const isMobile = useThemeMediaQuery((theme) => theme.breakpoints.down('lg'));\n  const { t } = useOwpTranslation();\n  const settings: SettingsConfigType = useAppSelector(selectCurrentSettings);\n  const resolvedTooltipTitle = tooltipTitle ?? t('Title.메뉴');\n  const resolvedSx: SxProps<Theme> | undefined =\n    surfaceTone === 'light'\n      ? [lightSurfaceButtonSx, ...(Array.isArray(sx) ? sx : sx ? [sx] : [])]\n      : sx;\n\n  const button = (\n    <IconButton\n      onClick={() => {\n        if (isMobile) {\n          dispatch(navbarToggleMobile());\n        } else {\n          dispatch(\n            setDefaultSettings(\n              set({}, 'layout.config.navbar.folded', !settings?.layout?.config?.navbar?.folded),\n            ),\n          );\n        }\n      }}\n      {...rest}\n      sx={resolvedSx}\n      className={clsx(className)}\n    >\n      {children}\n    </IconButton>\n  );\n\n  return (\n    <Tooltip title={resolvedTooltipTitle} placement=\"bottom\">\n      {button}\n    </Tooltip>\n  );\n}\n\nexport default NavbarToggleButton;\n"],"names":["lightSurfaceButtonSx","__name","theme","alpha","NavbarToggleButton","props","className","children","jsx","SvgIcon","surfaceTone","tooltipTitle","sx","rest","dispatch","useAppDispatch","isMobile","useThemeMediaQuery","t","useOwpTranslation","settings","useAppSelector","selectCurrentSettings","resolvedTooltipTitle","resolvedSx","button","IconButton","navbarToggleMobile","setDefaultSettings","set","_c","_b","_a","clsx","Tooltip"],"mappings":";;;;;;;;;;;;;;AAsBA,MAAMA,IAAuB,gBAAAC,EAAA,CAACC,OAAkB;AAAA,EAC9C,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAaC,EAAMD,EAAM,QAAQ,KAAK,SAASA,EAAM,QAAQ,SAAS,SAAS,OAAO,IAAI;AAAA,EAC1F,iBAAiBC,EAAMD,EAAM,QAAQ,OAAO,OAAOA,EAAM,QAAQ,SAAS,SAAS,OAAO,GAAG;AAAA,EAC7F,WAAW,iBAAiBC,EAAMD,EAAM,QAAQ,OAAO,OAAOA,EAAM,QAAQ,SAAS,SAAS,OAAO,IAAI,CAAC;AAAA,EAC1G,OAAOC,EAAMD,EAAM,QAAQ,KAAK,SAASA,EAAM,QAAQ,SAAS,SAAS,OAAO,IAAI;AAAA,EACpF,YAAYA,EAAM,YAAY,OAAO,CAAC,oBAAoB,gBAAgB,WAAW,GAAG;AAAA,IACtF,UAAUA,EAAM,YAAY,SAAS;AAAA,EAAA,CACtC;AAAA,EACD,WAAW;AAAA,IACT,iBAAiBC,EAAMD,EAAM,QAAQ,QAAQ,MAAMA,EAAM,QAAQ,SAAS,SAAS,OAAO,IAAI;AAAA,IAC9F,aAAaC,EAAMD,EAAM,QAAQ,QAAQ,MAAMA,EAAM,QAAQ,SAAS,SAAS,MAAM,IAAI;AAAA,IACzF,WAAW;AAAA,EAAA;AAEf,IAf6B;AAoB7B,SAASE,EAAmBC,GAAgC;AAC1D,QAAM;AAAA,IACJ,WAAAC,IAAY;AAAA,IACZ,UAAAC,IACE,gBAAAC,EAACC,GAAA,EAAQ,MAAM,IAAI,OAAM,UAAS,UAAA,4BAElC;AAAA,IAEF,aAAAC,IAAc;AAAA,IACd,cAAAC;AAAA,IACA,IAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDR,GAEES,IAAWC,EAAA,GACXC,IAAWC,EAAmB,CAACf,MAAUA,EAAM,YAAY,KAAK,IAAI,CAAC,GACrE,EAAE,GAAAgB,EAAA,IAAMC,EAAA,GACRC,IAA+BC,EAAeC,CAAqB,GACnEC,IAAuBZ,KAAgBO,EAAE,UAAU,GACnDM,IACJd,MAAgB,UACZ,CAACV,GAAsB,GAAI,MAAM,QAAQY,CAAE,IAAIA,IAAKA,IAAK,CAACA,CAAE,IAAI,CAAA,CAAG,IACnEA,GAEAa,IACJ,gBAAAjB;AAAA,IAACkB;AAAA,IAAA;AAAA,MACC,SAAS,gBAAAzB,EAAA,MAAM;;AACb,QACEa,EADEE,IACOW,MAGPC;AAAA,UACEC,EAAI,CAAA,GAAI,+BAA+B,GAACC,KAAAC,KAAAC,IAAAZ,KAAA,gBAAAA,EAAU,WAAV,gBAAAY,EAAkB,WAAlB,gBAAAD,EAA0B,WAA1B,QAAAD,EAAkC,OAAM;AAAA,QAAA,CAJvD;AAAA,MAQjC,GAVS;AAAA,MAWR,GAAGjB;AAAA,MACJ,IAAIW;AAAA,MACJ,WAAWS,EAAK3B,CAAS;AAAA,MAExB,UAAAC;AAAA,IAAA;AAAA,EAAA;AAIL,2BACG2B,GAAA,EAAQ,OAAOX,GAAsB,WAAU,UAC7C,UAAAE,GACH;AAEJ;AAlDSxB,EAAAG,GAAA;"}
+{"version":3,"file":"NavbarToggleButton.js","sources":["../../../../src/layout/components/navbar/NavbarToggleButton.tsx"],"sourcesContent":["import type { OwpSettingsConfigType as SettingsConfigType } from '@/types/OwpSettingsTypes';\nimport { OwpSvgIcon as SvgIcon } from '@/components/OwpSvgIcon';\nimport { useNavbarActions } from '@/hooks/useNavbar';\nimport { useOwpTranslation } from '@/hooks/useOwpTranslation';\nimport { useThemeMediaQuery } from '@/hooks/useThemeMediaQuery';\nimport {\n  useGetCurrentSettings,\n  useSetDefaultSettings,\n} from '@/hooks/useOwpSettings';\nimport IconButton, { type IconButtonProps } from '@mui/material/IconButton';\nimport Tooltip from '@mui/material/Tooltip';\nimport { alpha, type SxProps, type Theme } from '@mui/material/styles';\nimport clsx from 'clsx';\nimport { set } from 'es-toolkit/compat';\nimport { ReactNode } from 'react';\n\nexport type NavbarToggleButtonProps = IconButtonProps & {\n  surfaceTone?: 'inherit' | 'light';\n  tooltipTitle?: ReactNode;\n};\n\nconst lightSurfaceButtonSx = (theme: Theme) => ({\n  borderWidth: '1px',\n  borderStyle: 'solid',\n  borderColor: alpha(theme.palette.text.primary, theme.palette.mode === 'dark' ? 0.32 : 0.16),\n  backgroundColor: alpha(theme.palette.common.white, theme.palette.mode === 'dark' ? 0.08 : 0.9),\n  boxShadow: `inset 0 1px 0 ${alpha(theme.palette.common.white, theme.palette.mode === 'dark' ? 0.08 : 0.88)}`,\n  color: alpha(theme.palette.text.primary, theme.palette.mode === 'dark' ? 0.92 : 0.72),\n  transition: theme.transitions.create(['background-color', 'border-color', 'transform'], {\n    duration: theme.transitions.duration.shorter,\n  }),\n  '&:hover': {\n    backgroundColor: alpha(theme.palette.primary.main, theme.palette.mode === 'dark' ? 0.18 : 0.08),\n    borderColor: alpha(theme.palette.primary.main, theme.palette.mode === 'dark' ? 0.4 : 0.22),\n    transform: 'translateY(-1px)',\n  },\n});\n\n/**\n * The navbar toggle button.\n */\nfunction NavbarToggleButton(props: NavbarToggleButtonProps) {\n  const {\n    className = '',\n    children = (\n      <SvgIcon size={20} color=\"action\">\n        heroicons-outline:bars-3\n      </SvgIcon>\n    ),\n    surfaceTone = 'inherit',\n    tooltipTitle,\n    sx,\n    ...rest\n  } = props;\n\n  const isMobile = useThemeMediaQuery((theme) => theme.breakpoints.down('lg'));\n  const { t } = useOwpTranslation();\n  const { toggleMobile } = useNavbarActions();\n  const setDefaultSettings = useSetDefaultSettings();\n  const settings: SettingsConfigType = useGetCurrentSettings();\n  const resolvedTooltipTitle = tooltipTitle ?? t('Title.메뉴');\n  const resolvedSx: SxProps<Theme> | undefined =\n    surfaceTone === 'light'\n      ? [lightSurfaceButtonSx, ...(Array.isArray(sx) ? sx : sx ? [sx] : [])]\n      : sx;\n\n  const button = (\n    <IconButton\n      onClick={() => {\n        if (isMobile) {\n          toggleMobile();\n        } else {\n          setDefaultSettings(\n            set({}, 'layout.config.navbar.folded', !settings?.layout?.config?.navbar?.folded),\n          );\n        }\n      }}\n      {...rest}\n      sx={resolvedSx}\n      className={clsx(className)}\n    >\n      {children}\n    </IconButton>\n  );\n\n  return (\n    <Tooltip title={resolvedTooltipTitle} placement=\"bottom\">\n      {button}\n    </Tooltip>\n  );\n}\n\nexport default NavbarToggleButton;\n"],"names":["lightSurfaceButtonSx","__name","theme","alpha","NavbarToggleButton","props","className","children","jsx","SvgIcon","surfaceTone","tooltipTitle","sx","rest","isMobile","useThemeMediaQuery","t","useOwpTranslation","toggleMobile","useNavbarActions","setDefaultSettings","useSetDefaultSettings","settings","useGetCurrentSettings","resolvedTooltipTitle","resolvedSx","button","IconButton","set","_c","_b","_a","clsx","Tooltip"],"mappings":";;;;;;;;;;;;;AAqBA,MAAMA,IAAuB,gBAAAC,EAAA,CAACC,OAAkB;AAAA,EAC9C,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAaC,EAAMD,EAAM,QAAQ,KAAK,SAASA,EAAM,QAAQ,SAAS,SAAS,OAAO,IAAI;AAAA,EAC1F,iBAAiBC,EAAMD,EAAM,QAAQ,OAAO,OAAOA,EAAM,QAAQ,SAAS,SAAS,OAAO,GAAG;AAAA,EAC7F,WAAW,iBAAiBC,EAAMD,EAAM,QAAQ,OAAO,OAAOA,EAAM,QAAQ,SAAS,SAAS,OAAO,IAAI,CAAC;AAAA,EAC1G,OAAOC,EAAMD,EAAM,QAAQ,KAAK,SAASA,EAAM,QAAQ,SAAS,SAAS,OAAO,IAAI;AAAA,EACpF,YAAYA,EAAM,YAAY,OAAO,CAAC,oBAAoB,gBAAgB,WAAW,GAAG;AAAA,IACtF,UAAUA,EAAM,YAAY,SAAS;AAAA,EAAA,CACtC;AAAA,EACD,WAAW;AAAA,IACT,iBAAiBC,EAAMD,EAAM,QAAQ,QAAQ,MAAMA,EAAM,QAAQ,SAAS,SAAS,OAAO,IAAI;AAAA,IAC9F,aAAaC,EAAMD,EAAM,QAAQ,QAAQ,MAAMA,EAAM,QAAQ,SAAS,SAAS,MAAM,IAAI;AAAA,IACzF,WAAW;AAAA,EAAA;AAEf,IAf6B;AAoB7B,SAASE,EAAmBC,GAAgC;AAC1D,QAAM;AAAA,IACJ,WAAAC,IAAY;AAAA,IACZ,UAAAC,IACE,gBAAAC,EAACC,GAAA,EAAQ,MAAM,IAAI,OAAM,UAAS,UAAA,4BAElC;AAAA,IAEF,aAAAC,IAAc;AAAA,IACd,cAAAC;AAAA,IACA,IAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDR,GAEES,IAAWC,EAAmB,CAACb,MAAUA,EAAM,YAAY,KAAK,IAAI,CAAC,GACrE,EAAE,GAAAc,EAAA,IAAMC,EAAA,GACR,EAAE,cAAAC,EAAA,IAAiBC,EAAA,GACnBC,IAAqBC,EAAA,GACrBC,IAA+BC,EAAA,GAC/BC,IAAuBb,KAAgBK,EAAE,UAAU,GACnDS,IACJf,MAAgB,UACZ,CAACV,GAAsB,GAAI,MAAM,QAAQY,CAAE,IAAIA,IAAKA,IAAK,CAACA,CAAE,IAAI,CAAA,CAAG,IACnEA,GAEAc,IACJ,gBAAAlB;AAAA,IAACmB;AAAA,IAAA;AAAA,MACC,SAAS,gBAAA1B,EAAA,MAAM;;AACb,QAAIa,IACFI,EAAA,IAEAE;AAAA,UACEQ,EAAI,CAAA,GAAI,+BAA+B,GAACC,KAAAC,KAAAC,IAAAT,KAAA,gBAAAA,EAAU,WAAV,gBAAAS,EAAkB,WAAlB,gBAAAD,EAA0B,WAA1B,QAAAD,EAAkC,OAAM;AAAA,QAAA;AAAA,MAGtF,GARS;AAAA,MASR,GAAGhB;AAAA,MACJ,IAAIY;AAAA,MACJ,WAAWO,EAAK1B,CAAS;AAAA,MAExB,UAAAC;AAAA,IAAA;AAAA,EAAA;AAIL,2BACG0B,GAAA,EAAQ,OAAOT,GAAsB,WAAU,UAC7C,UAAAE,GACH;AAEJ;AAjDSzB,EAAAG,GAAA;"}