@owp/core 2.2.3 → 2.2.4

package/dist/components/OwpSection/OwpSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"OwpSection.js","sources":["../../../src/components/OwpSection/OwpSection.tsx"],"sourcesContent":["import FitbitIcon from '@mui/icons-material/Fitbit';\nimport { Divider, IconProps } from '@mui/material';\nimport clsx from 'clsx';\nimport type { HTMLAttributes, ReactNode } from 'react';\nimport { OwpPageTitle } from '../OwpPageTitle';\n\ninterface OwpSectionProps {\n  className?: string;\n  headerProps?: HTMLAttributes<HTMLDivElement>;\n  disableTitleIcon?: boolean;\n  usePageTitle?: boolean;\n  title?: ReactNode;\n  actions?: ReactNode;\n  leftSlot?: ReactNode;\n  centerSlot?: ReactNode;\n  children?: ReactNode;\n  iconSize?: IconProps['fontSize'];\n}\n\n/**\n * OwpSection 컴포넌트\n * @param className CSS 클래스명\n * @param title 제목\n * @param disableTitleIcon disableTitleIcon 값\n * @param headerProps headerProps props\n * @param usePageTitle usePageTitle 값\n * @param actions 액션 영역\n */\nconst OwpSection = ({\n  className,\n  title,\n  disableTitleIcon,\n  headerProps,\n  usePageTitle,\n  actions,\n  leftSlot,\n  centerSlot,\n  children,\n  iconSize,\n}: OwpSectionProps) => {\n  const hasTitle = title !== undefined && title !== null && title !== '';\n  const shouldRenderHeader = usePageTitle\n    ? Boolean(hasTitle || actions || leftSlot || centerSlot)\n    : Boolean(title || actions);\n\n  return (\n    <div className={clsx('OwpSection-root flex h-full w-full flex-col', className)}>\n      {shouldRenderHeader &&\n        (usePageTitle ? (\n          <div className=\"OwpSection-header\">\n            <div {...headerProps} className={clsx('w-full', headerProps?.className)}>\n              <OwpPageTitle\n                title={title}\n                leftSlot={leftSlot}\n                centerSlot={centerSlot}\n                actions={actions}\n              />\n            </div>\n            <Divider className=\"my-12\" />\n          </div>\n        ) : (\n          <div className=\"OwpSection-header mb-12 flex min-h-36 w-full items-center justify-between\">\n            <div {...headerProps} className={clsx('flex items-center gap-8', headerProps?.className)}>\n              {title && (\n                <>\n                  {!disableTitleIcon && (\n                    <FitbitIcon\n                      fontSize={iconSize}\n                      sx={{ fontSize: iconSize ? undefined : 24, color: 'secondary.main' }}\n                    />\n                  )}\n                  <h6 className=\"text-2xl font-medium\">{title}</h6>\n                </>\n              )}\n              {leftSlot && <div>{leftSlot}</div>}\n            </div>\n            {actions && <div className=\"space-x-8\">{actions}</div>}\n          </div>\n        ))}\n      <div className=\"OwpSection-body flex min-h-0 flex-1 flex-col\">{children}</div>\n    </div>\n  );\n};\n\nexport { OwpSection };\n"],"names":["OwpSection","__name","className","title","disableTitleIcon","headerProps","usePageTitle","actions","leftSlot","centerSlot","children","iconSize","hasTitle","shouldRenderHeader","clsx","jsxs","jsx","OwpPageTitle","Divider","Fragment","FitbitIcon"],"mappings":";;;;;;;AA4BA,MAAMA,IAAa,gBAAAC,EAAA,CAAC;AAAA,EAClB,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AACF,MAAuB;AACrB,QAAMC,IAAkCT,KAAU,QAAQA,MAAU,IAC9DU,IAAqBP,IACvB,GAAQM,KAAYL,KAAWC,KAAYC,KAC3C,GAAQN,KAASI;AAErB,2BACG,OAAA,EAAI,WAAWO,EAAK,+CAA+CZ,CAAS,GAC1E,UAAA;AAAA,IAAAW,MACEP,IACC,gBAAAS,EAAC,OAAA,EAAI,WAAU,qBACb,UAAA;AAAA,MAAA,gBAAAC,EAAC,OAAA,EAAK,GAAGX,GAAa,WAAWS,EAAK,UAAUT,KAAA,gBAAAA,EAAa,SAAS,GACpE,UAAA,gBAAAW;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,OAAAd;AAAA,UACA,UAAAK;AAAA,UACA,YAAAC;AAAA,UACA,SAAAF;AAAA,QAAA;AAAA,MAAA,GAEJ;AAAA,MACA,gBAAAS,EAACE,GAAA,EAAQ,WAAU,QAAA,CAAQ;AAAA,IAAA,EAAA,CAC7B,IAEA,gBAAAH,EAAC,OAAA,EAAI,WAAU,6EACb,UAAA;AAAA,MAAA,gBAAAA,EAAC,OAAA,EAAK,GAAGV,GAAa,WAAWS,EAAK,2BAA2BT,KAAA,gBAAAA,EAAa,SAAS,GACpF,UAAA;AAAA,QAAAF,KACC,gBAAAY,EAAAI,GAAA,EACG,UAAA;AAAA,UAAA,CAACf,KACA,gBAAAY;AAAA,YAACI;AAAA,YAAA;AAAA,cACC,UAAUT;AAAA,cACV,IAAI,EAAE,UAAUA,IAAW,SAAY,IAAI,OAAO,iBAAA;AAAA,YAAiB;AAAA,UAAA;AAAA,UAGvE,gBAAAK,EAAC,MAAA,EAAG,WAAU,wBAAwB,UAAAb,EAAA,CAAM;AAAA,QAAA,GAC9C;AAAA,QAEDK,KAAY,gBAAAQ,EAAC,OAAA,EAAK,UAAAR,EAAA,CAAS;AAAA,MAAA,GAC9B;AAAA,MACCD,KAAW,gBAAAS,EAAC,OAAA,EAAI,WAAU,aAAa,UAAAT,EAAA,CAAQ;AAAA,IAAA,EAAA,CAClD;AAAA,IAEJ,gBAAAS,EAAC,OAAA,EAAI,WAAU,gDAAgD,UAAAN,EAAA,CAAS;AAAA,EAAA,GAC1E;AAEJ,GAtDmB;"}
+{"version":3,"file":"OwpSection.js","sources":["../../../src/components/OwpSection/OwpSection.tsx"],"sourcesContent":["import FitbitIcon from '@mui/icons-material/Fitbit';\nimport { Divider, type IconProps } from '@mui/material';\nimport { useHeaderWrapState } from '@/hooks/useHeaderWrapState';\nimport clsx from 'clsx';\nimport type { HTMLAttributes, ReactNode } from 'react';\nimport { OwpPageTitle } from '../OwpPageTitle';\n\ninterface OwpSectionProps {\n  className?: string;\n  headerProps?: HTMLAttributes<HTMLDivElement>;\n  disableTitleIcon?: boolean;\n  usePageTitle?: boolean;\n  title?: ReactNode;\n  actions?: ReactNode;\n  leftSlot?: ReactNode;\n  centerSlot?: ReactNode;\n  children?: ReactNode;\n  iconSize?: IconProps['fontSize'];\n}\n\n/**\n * OwpSection 컴포넌트\n * @param className CSS 클래스명\n * @param title 제목\n * @param disableTitleIcon disableTitleIcon 값\n * @param headerProps headerProps props\n * @param usePageTitle usePageTitle 값\n * @param leftSlot leftSlot 값\n * @param centerSlot centerSlot 값\n * @param actions 액션 영역\n */\nconst OwpSection = ({\n  className,\n  title,\n  disableTitleIcon,\n  headerProps,\n  usePageTitle,\n  actions,\n  leftSlot,\n  centerSlot,\n  children,\n  iconSize,\n}: OwpSectionProps) => {\n  const hasTitle = title !== undefined && title !== null && title !== '';\n  const hasSlots = Boolean(leftSlot || centerSlot);\n  const { containerRef, titleRef, slotsRef, actionsRef, isWrapped } = useHeaderWrapState([\n    title,\n    leftSlot,\n    centerSlot,\n    actions,\n    disableTitleIcon,\n    iconSize,\n  ]);\n  const shouldRenderHeader = usePageTitle\n    ? Boolean(hasTitle || actions || leftSlot || centerSlot)\n    : Boolean(hasTitle || actions || leftSlot || centerSlot);\n\n  return (\n    <div className={clsx('OwpSection-root flex h-full w-full flex-col', className)}>\n      {shouldRenderHeader &&\n        (usePageTitle ? (\n          <div className=\"OwpSection-header\">\n            <div {...headerProps} className={clsx('w-full', headerProps?.className)}>\n              <OwpPageTitle\n                title={title}\n                leftSlot={leftSlot}\n                centerSlot={centerSlot}\n                actions={actions}\n              />\n            </div>\n            <Divider className=\"my-12\" />\n          </div>\n        ) : (\n          <div className=\"OwpSection-header mb-12 min-h-36 w-full\">\n            <div\n              ref={containerRef}\n              {...headerProps}\n              className={clsx(\n                'min-h-36 w-full',\n                isWrapped\n                  ? 'flex flex-col gap-8'\n                  : 'grid grid-cols-[auto_minmax(0,1fr)_auto] items-center gap-x-8 gap-y-8',\n                headerProps?.className,\n              )}\n            >\n              {title && (\n                <div\n                  ref={titleRef}\n                  className={clsx(\n                    'flex shrink-0 items-center gap-8 whitespace-nowrap',\n                    isWrapped ? 'order-1 self-start' : 'col-start-1',\n                  )}\n                >\n                  {!disableTitleIcon && (\n                    <FitbitIcon\n                      className=\"shrink-0\"\n                      fontSize={iconSize}\n                      sx={{ fontSize: iconSize ? undefined : 24, color: 'secondary.main' }}\n                    />\n                  )}\n                  <h6 className=\"shrink-0 whitespace-nowrap text-2xl font-medium\">{title}</h6>\n                </div>\n              )}\n              {hasSlots && (\n                <div\n                  ref={slotsRef}\n                  className={clsx(\n                    'flex max-w-full',\n                    isWrapped ? 'order-2 self-end justify-end' : 'col-start-2 justify-self-center',\n                  )}\n                >\n                  <div\n                    className={clsx(\n                      'flex max-w-full items-center gap-8',\n                      isWrapped ? 'flex-wrap justify-end' : 'flex-nowrap justify-center',\n                    )}\n                  >\n                    {leftSlot && <div className=\"max-w-full\">{leftSlot}</div>}\n                    {centerSlot && <div className=\"max-w-full\">{centerSlot}</div>}\n                  </div>\n                </div>\n              )}\n              {actions && (\n                <div\n                  ref={actionsRef}\n                  className={clsx(\n                    'flex max-w-full justify-end',\n                    isWrapped ? 'order-3 self-end' : 'col-start-3 justify-self-end',\n                  )}\n                >\n                  <div className=\"flex max-w-full flex-wrap items-center gap-8\">{actions}</div>\n                </div>\n              )}\n            </div>\n          </div>\n        ))}\n      <div className=\"OwpSection-body flex min-h-0 flex-1 flex-col\">{children}</div>\n    </div>\n  );\n};\n\nexport { OwpSection };\n"],"names":["OwpSection","__name","className","title","disableTitleIcon","headerProps","usePageTitle","actions","leftSlot","centerSlot","children","iconSize","hasTitle","hasSlots","containerRef","titleRef","slotsRef","actionsRef","isWrapped","useHeaderWrapState","shouldRenderHeader","clsx","jsxs","jsx","OwpPageTitle","Divider","FitbitIcon"],"mappings":"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"}

package/dist/hooks/useHeaderWrapState.js

@@ -0,0 +1,48 @@
+var b = Object.defineProperty;
+var s = (t, e) => b(t, "name", { value: e, configurable: !0 });
+import { useRef as u, useState as C, useLayoutEffect as S } from "react";
+const y = /* @__PURE__ */ s((t) => !t || t.getClientRects().length === 0 ? 0 : t.offsetWidth, "getVisibleElementWidth"), h = /* @__PURE__ */ s((t) => {
+  if (!t || t.getClientRects().length === 0)
+    return 0;
+  const e = Array.from(t.children).filter(
+    (r) => r.getClientRects().length > 0
+  );
+  if (e.length === 0)
+    return t.offsetWidth;
+  const n = window.getComputedStyle(t), o = Number.parseFloat(n.columnGap || n.gap || "0") || 0;
+  return e.reduce((r, l) => r + l.offsetWidth, 0) + o * Math.max(e.length - 1, 0);
+}, "getGroupContentWidth"), E = /* @__PURE__ */ s((t = []) => {
+  const e = u(null), n = u(null), o = u(null), r = u(null), [l, g] = C(!1);
+  return S(() => {
+    const c = e.current;
+    if (!c)
+      return;
+    const d = /* @__PURE__ */ s(() => {
+      const i = window.getComputedStyle(c), W = Number.parseFloat(i.columnGap || i.gap || "0") || 0, p = [
+        y(n.current),
+        h(o.current),
+        h(r.current)
+      ].filter((a) => a > 0), m = p.reduce((a, R) => a + R, 0) + W * Math.max(p.length - 1, 0);
+      g(m > c.clientWidth);
+    }, "updateWrapState");
+    d();
+    const f = new ResizeObserver(() => {
+      d();
+    });
+    return [c, n.current, o.current, r.current].filter(Boolean).forEach((i) => {
+      f.observe(i);
+    }), () => {
+      f.disconnect();
+    };
+  }, [t]), {
+    containerRef: e,
+    titleRef: n,
+    slotsRef: o,
+    actionsRef: r,
+    isWrapped: l
+  };
+}, "useHeaderWrapState");
+export {
+  E as useHeaderWrapState
+};
+//# sourceMappingURL=useHeaderWrapState.js.map

package/dist/hooks/useHeaderWrapState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useHeaderWrapState.js","sources":["../../src/hooks/useHeaderWrapState.ts"],"sourcesContent":["import { useLayoutEffect, useRef, useState, type RefObject } from 'react';\n\ntype HeaderWrapState = {\n  containerRef: RefObject<HTMLDivElement | null>;\n  titleRef: RefObject<HTMLDivElement | null>;\n  slotsRef: RefObject<HTMLDivElement | null>;\n  actionsRef: RefObject<HTMLDivElement | null>;\n  isWrapped: boolean;\n};\n\nconst getVisibleElementWidth = (element: HTMLElement | null) => {\n  if (!element || element.getClientRects().length === 0) {\n    return 0;\n  }\n\n  return element.offsetWidth;\n};\n\nconst getGroupContentWidth = (element: HTMLElement | null) => {\n  if (!element || element.getClientRects().length === 0) {\n    return 0;\n  }\n\n  const visibleChildren = Array.from(element.children).filter(\n    (child) => (child as HTMLElement).getClientRects().length > 0,\n  ) as HTMLElement[];\n\n  if (visibleChildren.length === 0) {\n    return element.offsetWidth;\n  }\n\n  const computedStyle = window.getComputedStyle(element);\n  const gap = Number.parseFloat(computedStyle.columnGap || computedStyle.gap || '0') || 0;\n\n  return (\n    visibleChildren.reduce((totalWidth, child) => totalWidth + child.offsetWidth, 0) +\n    gap * Math.max(visibleChildren.length - 1, 0)\n  );\n};\n\n/**\n * 헤더 한 줄 배치 가능 여부 계산 훅\n * @param deps 측정 재실행 의존성\n */\nconst useHeaderWrapState = (deps: unknown[] = []): HeaderWrapState => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const titleRef = useRef<HTMLDivElement>(null);\n  const slotsRef = useRef<HTMLDivElement>(null);\n  const actionsRef = useRef<HTMLDivElement>(null);\n  const [isWrapped, setIsWrapped] = useState(false);\n\n  useLayoutEffect(() => {\n    const containerElement = containerRef.current;\n\n    if (!containerElement) {\n      return undefined;\n    }\n\n    const updateWrapState = () => {\n      const containerStyle = window.getComputedStyle(containerElement);\n      const columnGap =\n        Number.parseFloat(containerStyle.columnGap || containerStyle.gap || '0') || 0;\n      const groupWidths = [\n        getVisibleElementWidth(titleRef.current),\n        getGroupContentWidth(slotsRef.current),\n        getGroupContentWidth(actionsRef.current),\n      ].filter((width) => width > 0);\n      const requiredWidth =\n        groupWidths.reduce((totalWidth, width) => totalWidth + width, 0) +\n        columnGap * Math.max(groupWidths.length - 1, 0);\n\n      setIsWrapped(requiredWidth > containerElement.clientWidth);\n    };\n\n    updateWrapState();\n\n    const resizeObserver = new ResizeObserver(() => {\n      updateWrapState();\n    });\n\n    [containerElement, titleRef.current, slotsRef.current, actionsRef.current]\n      .filter(Boolean)\n      .forEach((element) => {\n        resizeObserver.observe(element as HTMLElement);\n      });\n\n    return () => {\n      resizeObserver.disconnect();\n    };\n  }, [deps]);\n\n  return {\n    containerRef,\n    titleRef,\n    slotsRef,\n    actionsRef,\n    isWrapped,\n  };\n};\n\nexport { useHeaderWrapState };\n"],"names":["getVisibleElementWidth","__name","element","getGroupContentWidth","visibleChildren","child","computedStyle","gap","totalWidth","useHeaderWrapState","deps","containerRef","useRef","titleRef","slotsRef","actionsRef","isWrapped","setIsWrapped","useState","useLayoutEffect","containerElement","updateWrapState","containerStyle","columnGap","groupWidths","width","requiredWidth","resizeObserver"],"mappings":";;;AAUA,MAAMA,IAAyB,gBAAAC,EAAA,CAACC,MAC1B,CAACA,KAAWA,EAAQ,eAAA,EAAiB,WAAW,IAC3C,IAGFA,EAAQ,aALc,2BAQzBC,IAAuB,gBAAAF,EAAA,CAACC,MAAgC;AAC5D,MAAI,CAACA,KAAWA,EAAQ,eAAA,EAAiB,WAAW;AAClD,WAAO;AAGT,QAAME,IAAkB,MAAM,KAAKF,EAAQ,QAAQ,EAAE;AAAA,IACnD,CAACG,MAAWA,EAAsB,eAAA,EAAiB,SAAS;AAAA,EAAA;AAG9D,MAAID,EAAgB,WAAW;AAC7B,WAAOF,EAAQ;AAGjB,QAAMI,IAAgB,OAAO,iBAAiBJ,CAAO,GAC/CK,IAAM,OAAO,WAAWD,EAAc,aAAaA,EAAc,OAAO,GAAG,KAAK;AAEtF,SACEF,EAAgB,OAAO,CAACI,GAAYH,MAAUG,IAAaH,EAAM,aAAa,CAAC,IAC/EE,IAAM,KAAK,IAAIH,EAAgB,SAAS,GAAG,CAAC;AAEhD,GApB6B,yBA0BvBK,IAAqB,gBAAAR,EAAA,CAACS,IAAkB,OAAwB;AACpE,QAAMC,IAAeC,EAAuB,IAAI,GAC1CC,IAAWD,EAAuB,IAAI,GACtCE,IAAWF,EAAuB,IAAI,GACtCG,IAAaH,EAAuB,IAAI,GACxC,CAACI,GAAWC,CAAY,IAAIC,EAAS,EAAK;AAEhD,SAAAC,EAAgB,MAAM;AACpB,UAAMC,IAAmBT,EAAa;AAEtC,QAAI,CAACS;AACH;AAGF,UAAMC,IAAkB,gBAAApB,EAAA,MAAM;AAC5B,YAAMqB,IAAiB,OAAO,iBAAiBF,CAAgB,GACzDG,IACJ,OAAO,WAAWD,EAAe,aAAaA,EAAe,OAAO,GAAG,KAAK,GACxEE,IAAc;AAAA,QAClBxB,EAAuBa,EAAS,OAAO;AAAA,QACvCV,EAAqBW,EAAS,OAAO;AAAA,QACrCX,EAAqBY,EAAW,OAAO;AAAA,MAAA,EACvC,OAAO,CAACU,MAAUA,IAAQ,CAAC,GACvBC,IACJF,EAAY,OAAO,CAAChB,GAAYiB,MAAUjB,IAAaiB,GAAO,CAAC,IAC/DF,IAAY,KAAK,IAAIC,EAAY,SAAS,GAAG,CAAC;AAEhD,MAAAP,EAAaS,IAAgBN,EAAiB,WAAW;AAAA,IAC3D,GAdwB;AAgBxB,IAAAC,EAAA;AAEA,UAAMM,IAAiB,IAAI,eAAe,MAAM;AAC9C,MAAAN,EAAA;AAAA,IACF,CAAC;AAED,YAACD,GAAkBP,EAAS,SAASC,EAAS,SAASC,EAAW,OAAO,EACtE,OAAO,OAAO,EACd,QAAQ,CAACb,MAAY;AACpB,MAAAyB,EAAe,QAAQzB,CAAsB;AAAA,IAC/C,CAAC,GAEI,MAAM;AACX,MAAAyB,EAAe,WAAA;AAAA,IACjB;AAAA,EACF,GAAG,CAACjB,CAAI,CAAC,GAEF;AAAA,IACL,cAAAC;AAAA,IACA,UAAAE;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,WAAAC;AAAA,EAAA;AAEJ,GAtD2B;"}

package/dist/hooks.js

@@ -1,33 +1,34 @@
-import { useGetCommonCodeList as r, useSetCommonCodeList as t } from "./hooks/useCommonCodeList.js";
+import { useGetCommonCodeList as o, useSetCommonCodeList as t } from "./hooks/useCommonCodeList.js";
 import { useAccessTokenGuard as u } from "./hooks/useAccessTokenGuard.js";
-import { useAppDispatch as p, useAppSelector as f, useAppStore as n } from "./hooks/useAppStore.js";
+import { useAppDispatch as m, useAppSelector as f, useAppStore as n } from "./hooks/useAppStore.js";
 import { useConfirm as a } from "./hooks/useConfirm.js";
 import { useGetCurrentLanguage as C, useGetLanguageList as L, useSetCurrentLanguage as g } from "./hooks/useCurrentLanguage.js";
-import { useGetLogoSrc as G, useSetLogoSrc as S } from "./hooks/useLogoSrc.js";
+import { useGetLogoSrc as c, useSetLogoSrc as G } from "./hooks/useLogoSrc.js";
 import { useGetCurrentUser as A, useSetCurrentUser as E } from "./hooks/useCurrentUser.js";
 import { useGetCurrentUserId as h, useSetCurrentUserId as v } from "./hooks/useCurrentUserId.js";
 import { useDebounce as I } from "./hooks/useDebounce.js";
 import { useDeepCompareEffect as k, useDeepCompareEffectNoCheck as N, useDeepCompareMemoize as l } from "./hooks/useDeepCompareEffect.js";
-import { useInitApp as M } from "./hooks/useInitApp.js";
-import { useInitCommonCodes as b } from "./hooks/useInitCommonCodes.js";
-import { useGetNavigationList as y, useSetNavigationList as z } from "./hooks/useNavigation.js";
-import { useOwpTranslation as F } from "./hooks/useOwpTranslation.js";
-import { useGetPageLockLoading as O, usePageLockLoading as Q } from "./hooks/usePageLockLoading.js";
+import { useHeaderWrapState as M } from "./hooks/useHeaderWrapState.js";
+import { useInitApp as b } from "./hooks/useInitApp.js";
+import { useInitCommonCodes as y } from "./hooks/useInitCommonCodes.js";
+import { useGetNavigationList as B, useSetNavigationList as F } from "./hooks/useNavigation.js";
+import { useOwpTranslation as K } from "./hooks/useOwpTranslation.js";
+import { useGetPageLockLoading as Q, usePageLockLoading as W } from "./hooks/usePageLockLoading.js";
 import { usePrevious as q } from "./hooks/usePrevious.js";
-import { useGetShortcuts as J, useSetShortcuts as R } from "./hooks/useShortcuts.js";
-import { getEnv as W, setEnv as X, useStorage as Y } from "./hooks/useStorage.js";
-import { useThemeMediaQuery as $ } from "./hooks/useThemeMediaQuery.js";
-import { useTimeout as oe } from "./hooks/useTimeout.js";
-import { useTreeGridCommonCodeEnums as te } from "./hooks/useTreeGridCommonCodeEnums.js";
-import { useTreeGridEnums as ue } from "./hooks/useTreeGridEnums.js";
-import { useTreeGridExcelExport as pe } from "./hooks/useTreeGridExcelExport.js";
-import { FALLBACK_LANGUAGE_LIST as ne } from "./constants/language.js";
+import { useGetShortcuts as R, useSetShortcuts as V } from "./hooks/useShortcuts.js";
+import { getEnv as Y, setEnv as Z, useStorage as $ } from "./hooks/useStorage.js";
+import { useThemeMediaQuery as re } from "./hooks/useThemeMediaQuery.js";
+import { useTimeout as te } from "./hooks/useTimeout.js";
+import { useTreeGridCommonCodeEnums as ue } from "./hooks/useTreeGridCommonCodeEnums.js";
+import { useTreeGridEnums as me } from "./hooks/useTreeGridEnums.js";
+import { useTreeGridExcelExport as ne } from "./hooks/useTreeGridExcelExport.js";
+import { FALLBACK_LANGUAGE_LIST as ae } from "./constants/language.js";
 export {
-  ne as FALLBACK_LANGUAGE_LIST,
-  W as getEnv,
-  X as setEnv,
+  ae as FALLBACK_LANGUAGE_LIST,
+  Y as getEnv,
+  Z as setEnv,
   u as useAccessTokenGuard,
-  p as useAppDispatch,
+  m as useAppDispatch,
   f as useAppSelector,
   n as useAppStore,
   a as useConfirm,
@@ -35,32 +36,33 @@ export {
   k as useDeepCompareEffect,
   N as useDeepCompareEffectNoCheck,
   l as useDeepCompareMemoize,
-  r as useGetCommonCodeList,
+  o as useGetCommonCodeList,
   C as useGetCurrentLanguage,
   A as useGetCurrentUser,
   h as useGetCurrentUserId,
   L as useGetLanguageList,
-  G as useGetLogoSrc,
-  y as useGetNavigationList,
-  O as useGetPageLockLoading,
-  J as useGetShortcuts,
-  M as useInitApp,
-  b as useInitCommonCodes,
-  F as useOwpTranslation,
-  Q as usePageLockLoading,
+  c as useGetLogoSrc,
+  B as useGetNavigationList,
+  Q as useGetPageLockLoading,
+  R as useGetShortcuts,
+  M as useHeaderWrapState,
+  b as useInitApp,
+  y as useInitCommonCodes,
+  K as useOwpTranslation,
+  W as usePageLockLoading,
   q as usePrevious,
   t as useSetCommonCodeList,
   g as useSetCurrentLanguage,
   E as useSetCurrentUser,
   v as useSetCurrentUserId,
-  S as useSetLogoSrc,
-  z as useSetNavigationList,
-  R as useSetShortcuts,
-  Y as useStorage,
-  $ as useThemeMediaQuery,
-  oe as useTimeout,
-  te as useTreeGridCommonCodeEnums,
-  ue as useTreeGridEnums,
-  pe as useTreeGridExcelExport
+  G as useSetLogoSrc,
+  F as useSetNavigationList,
+  V as useSetShortcuts,
+  $ as useStorage,
+  re as useThemeMediaQuery,
+  te as useTimeout,
+  ue as useTreeGridCommonCodeEnums,
+  me as useTreeGridEnums,
+  ne as useTreeGridExcelExport
 };
 //# sourceMappingURL=hooks.js.map

package/dist/hooks.js.map

@@ -1 +1 @@
-{"version":3,"file":"hooks.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"hooks.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/layout/components/navigation/vertical/NavVerticalLayout.js

@@ -1,21 +1,22 @@
-var m = Object.defineProperty;
-var a = (t, i) => m(t, "name", { value: i, configurable: !0 });
-import { jsx as r } 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 g from "@mui/material/List";
-import { styled as v } from "@mui/material/styles";
-import { clsx as u } from "../../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js";
+var u = Object.defineProperty;
+var a = (e, t) => u(e, "name", { value: t, configurable: !0 });
+import { jsx as d } 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 h from "@mui/material/List";
+import { styled as w } from "@mui/material/styles";
+import { clsx as f } from "../../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js";
+import { useRef as v, useEffect as b } from "react";
 import { NavItem as y } from "../NavItem.js";
-const b = v(g)(({ theme: t }) => ({
+const S = w(h)(({ theme: e }) => ({
   "& .owp-list-item": {
     "&:hover": {
       backgroundColor: "rgba(0,0,0,.04)",
-      ...t.applyStyles("dark", {
+      ...e.applyStyles("dark", {
         backgroundColor: "rgba(255, 255, 255, 0.05)"
       })
     },
     "&:focus:not(.active)": {
       backgroundColor: "rgba(0,0,0,.05)",
-      ...t.applyStyles("dark", {
+      ...e.applyStyles("dark", {
         backgroundColor: "rgba(255, 255, 255, 0.06)"
       })
     }
@@ -39,32 +40,67 @@ const b = v(g)(({ theme: t }) => ({
       height: 32
     }
   }
-}));
-function L(t) {
-  const { navigation: i, active: s, dense: l, className: p, onItemClick: o, checkPermission: n, openedCollapseIds: c } = t;
-  function d(e) {
-    o == null || o(e);
+})), x = '.owp-list-item[aria-current="page"], .owp-list-item.active', g = 40, C = 0.35, I = /* @__PURE__ */ a((e) => {
+  const t = e.parentElement;
+  if (t && t.scrollHeight > t.clientHeight)
+    return t;
+  let o = t == null ? void 0 : t.parentElement;
+  for (; o; ) {
+    if (o.scrollHeight > o.clientHeight)
+      return o;
+    o = o.parentElement;
   }
-  return a(d, "handleItemClick"), /* @__PURE__ */ r(
-    b,
+  return null;
+}, "getNavigationScrollContainer"), k = /* @__PURE__ */ a((e) => {
+  const t = e.querySelectorAll(x), o = t.item(t.length - 1);
+  if (!o)
+    return;
+  const i = I(e);
+  if (!i)
+    return;
+  const l = i.getBoundingClientRect(), n = o.getBoundingClientRect(), p = n.top < l.top + g, s = n.bottom > l.bottom - g;
+  if (p || s) {
+    const c = i.scrollTop + (n.top - l.top) - i.clientHeight * C + n.height / 2, m = i.scrollHeight - i.clientHeight;
+    i.scrollTo({
+      top: Math.min(Math.max(c, 0), m),
+      behavior: "smooth"
+    });
+  }
+}, "scrollSelectedItemIntoView");
+function L(e) {
+  const { navigation: t, active: o, dense: i, className: l, onItemClick: n, checkPermission: p, openedCollapseIds: s } = e, c = v(null);
+  b(() => {
+    const r = window.requestAnimationFrame(() => {
+      c.current && k(c.current);
+    });
+    return () => {
+      window.cancelAnimationFrame(r);
+    };
+  }, [s]);
+  function m(r) {
+    n == null || n(r);
+  }
+  return a(m, "handleItemClick"), /* @__PURE__ */ d(
+    S,
     {
-      className: u(
+      ref: c,
+      className: f(
         "navigation whitespace-nowrap px-12 py-0",
-        `active-${s}-list`,
-        l && "dense",
-        p
+        `active-${o}-list`,
+        i && "dense",
+        l
       ),
-      children: i.map((e) => /* @__PURE__ */ r(
+      children: t.map((r) => /* @__PURE__ */ d(
         y,
         {
-          type: `vertical-${e.type}`,
-          item: e,
+          type: `vertical-${r.type}`,
+          item: r,
           nestedLevel: 0,
-          onItemClick: d,
-          checkPermission: n,
-          openedCollapseIds: c
+          onItemClick: m,
+          checkPermission: p,
+          openedCollapseIds: s
         },
-        e.id
+        r.id
       ))
     }
   );

package/dist/layout/components/navigation/vertical/NavVerticalLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavVerticalLayout.js","sources":["../../../../../src/layout/components/navigation/vertical/NavVerticalLayout.tsx"],"sourcesContent":["import List from '@mui/material/List';\nimport { styled } from '@mui/material/styles';\nimport type { OwpNavItemType as NavItemType } from '@/types/OwpNavigationTypes';\nimport clsx from 'clsx';\nimport { NavItem } from '../NavItem';\nimport { NavigationMenuProps } from '../NavigationMenu';\n\nconst StyledList = styled(List)(({ theme }) => ({\n  '& .owp-list-item': {\n    '&:hover': {\n      backgroundColor: 'rgba(0,0,0,.04)',\n      ...theme.applyStyles('dark', {\n        backgroundColor: 'rgba(255, 255, 255, 0.05)',\n      }),\n    },\n    '&:focus:not(.active)': {\n      backgroundColor: 'rgba(0,0,0,.05)',\n      ...theme.applyStyles('dark', {\n        backgroundColor: 'rgba(255, 255, 255, 0.06)',\n      }),\n    },\n  },\n  '& .owp-list-item-text': {\n    margin: 0,\n  },\n  '& .owp-list-item-text-primary': {\n    lineHeight: '20px',\n  },\n  '&.active-square-list': {\n    '& .owp-list-item, & .active.owp-list-item': {\n      width: '100%',\n      borderRadius: '0',\n    },\n  },\n  '&.dense': {\n    '& .owp-list-item': {\n      paddingTop: 0,\n      paddingBottom: 0,\n      height: 32,\n    },\n  },\n}));\n\n/**\n * NavVerticalLayout\n * This component is used to render vertical navigations using\n * the Material-UI List component. It accepts the NavigationMenuProps props\n * and renders the nav items accordingly.\n */\nfunction NavVerticalLayout(props: NavigationMenuProps) {\n  const { navigation, active, dense, className, onItemClick, checkPermission, openedCollapseIds } =\n    props;\n\n  function handleItemClick(item: NavItemType) {\n    onItemClick?.(item);\n  }\n\n  return (\n    <StyledList\n      className={clsx(\n        'navigation whitespace-nowrap px-12 py-0',\n        `active-${active}-list`,\n        dense && 'dense',\n        className,\n      )}\n    >\n      {navigation.map((_item) => (\n        <NavItem\n          key={_item.id}\n          type={`vertical-${_item.type}`}\n          item={_item}\n          nestedLevel={0}\n          onItemClick={handleItemClick}\n          checkPermission={checkPermission}\n          openedCollapseIds={openedCollapseIds}\n        />\n      ))}\n    </StyledList>\n  );\n}\n\nexport { NavVerticalLayout };\n"],"names":["StyledList","styled","List","theme","NavVerticalLayout","props","navigation","active","dense","className","onItemClick","checkPermission","openedCollapseIds","handleItemClick","item","__name","jsx","clsx","_item","NavItem"],"mappings":";;;;;;;AAOA,MAAMA,IAAaC,EAAOC,CAAI,EAAE,CAAC,EAAE,OAAAC,SAAa;AAAA,EAC9C,oBAAoB;AAAA,IAClB,WAAW;AAAA,MACT,iBAAiB;AAAA,MACjB,GAAGA,EAAM,YAAY,QAAQ;AAAA,QAC3B,iBAAiB;AAAA,MAAA,CAClB;AAAA,IAAA;AAAA,IAEH,wBAAwB;AAAA,MACtB,iBAAiB;AAAA,MACjB,GAAGA,EAAM,YAAY,QAAQ;AAAA,QAC3B,iBAAiB;AAAA,MAAA,CAClB;AAAA,IAAA;AAAA,EACH;AAAA,EAEF,yBAAyB;AAAA,IACvB,QAAQ;AAAA,EAAA;AAAA,EAEV,iCAAiC;AAAA,IAC/B,YAAY;AAAA,EAAA;AAAA,EAEd,wBAAwB;AAAA,IACtB,6CAA6C;AAAA,MAC3C,OAAO;AAAA,MACP,cAAc;AAAA,IAAA;AAAA,EAChB;AAAA,EAEF,WAAW;AAAA,IACT,oBAAoB;AAAA,MAClB,YAAY;AAAA,MACZ,eAAe;AAAA,MACf,QAAQ;AAAA,IAAA;AAAA,EACV;AAEJ,EAAE;AAQF,SAASC,EAAkBC,GAA4B;AACrD,QAAM,EAAE,YAAAC,GAAY,QAAAC,GAAQ,OAAAC,GAAO,WAAAC,GAAW,aAAAC,GAAa,iBAAAC,GAAiB,mBAAAC,MAC1EP;AAEF,WAASQ,EAAgBC,GAAmB;AAC1C,IAAAJ,KAAA,QAAAA,EAAcI;AAAA,EAChB;AAFS,SAAAC,EAAAF,GAAA,oBAKP,gBAAAG;AAAA,IAAChB;AAAA,IAAA;AAAA,MACC,WAAWiB;AAAA,QACT;AAAA,QACA,UAAUV,CAAM;AAAA,QAChBC,KAAS;AAAA,QACTC;AAAA,MAAA;AAAA,MAGD,UAAAH,EAAW,IAAI,CAACY,MACf,gBAAAF;AAAA,QAACG;AAAA,QAAA;AAAA,UAEC,MAAM,YAAYD,EAAM,IAAI;AAAA,UAC5B,MAAMA;AAAA,UACN,aAAa;AAAA,UACb,aAAaL;AAAA,UACb,iBAAAF;AAAA,UACA,mBAAAC;AAAA,QAAA;AAAA,QANKM,EAAM;AAAA,MAAA,CAQd;AAAA,IAAA;AAAA,EAAA;AAGP;AA9BSH,EAAAX,GAAA;"}
+{"version":3,"file":"NavVerticalLayout.js","sources":["../../../../../src/layout/components/navigation/vertical/NavVerticalLayout.tsx"],"sourcesContent":["import List from '@mui/material/List';\nimport { styled } from '@mui/material/styles';\nimport type { OwpNavItemType as NavItemType } from '@/types/OwpNavigationTypes';\nimport clsx from 'clsx';\nimport { useEffect, useRef } from 'react';\nimport { NavItem } from '../NavItem';\nimport { NavigationMenuProps } from '../NavigationMenu';\n\nconst StyledList = styled(List)(({ theme }) => ({\n  '& .owp-list-item': {\n    '&:hover': {\n      backgroundColor: 'rgba(0,0,0,.04)',\n      ...theme.applyStyles('dark', {\n        backgroundColor: 'rgba(255, 255, 255, 0.05)',\n      }),\n    },\n    '&:focus:not(.active)': {\n      backgroundColor: 'rgba(0,0,0,.05)',\n      ...theme.applyStyles('dark', {\n        backgroundColor: 'rgba(255, 255, 255, 0.06)',\n      }),\n    },\n  },\n  '& .owp-list-item-text': {\n    margin: 0,\n  },\n  '& .owp-list-item-text-primary': {\n    lineHeight: '20px',\n  },\n  '&.active-square-list': {\n    '& .owp-list-item, & .active.owp-list-item': {\n      width: '100%',\n      borderRadius: '0',\n    },\n  },\n  '&.dense': {\n    '& .owp-list-item': {\n      paddingTop: 0,\n      paddingBottom: 0,\n      height: 32,\n    },\n  },\n}));\n\nconst selectedNavigationItemSelector = '.owp-list-item[aria-current=\"page\"], .owp-list-item.active';\nconst navigationScrollViewportPadding = 40;\nconst navigationScrollAnchorRatio = 0.35;\n\n/**\n * 네비게이션 스크롤 컨테이너 조회\n * @param navigationElement 네비게이션 리스트 요소\n */\nconst getNavigationScrollContainer = (navigationElement: HTMLUListElement) => {\n  const directParentElement = navigationElement.parentElement;\n\n  if (\n    directParentElement &&\n    directParentElement.scrollHeight > directParentElement.clientHeight\n  ) {\n    return directParentElement;\n  }\n\n  let currentElement = directParentElement?.parentElement;\n\n  while (currentElement) {\n    if (currentElement.scrollHeight > currentElement.clientHeight) {\n      return currentElement;\n    }\n\n    currentElement = currentElement.parentElement;\n  }\n\n  return null;\n};\n\n/**\n * 선택 메뉴 가시 영역 정렬\n * @param navigationElement 네비게이션 리스트 요소\n */\nconst scrollSelectedItemIntoView = (navigationElement: HTMLUListElement) => {\n  const selectedItems = navigationElement.querySelectorAll<HTMLElement>(selectedNavigationItemSelector);\n  const selectedItem = selectedItems.item(selectedItems.length - 1);\n\n  if (!selectedItem) {\n    return;\n  }\n\n  const scrollContainer = getNavigationScrollContainer(navigationElement);\n\n  if (!scrollContainer) {\n    return;\n  }\n\n  const containerRect = scrollContainer.getBoundingClientRect();\n  const selectedItemRect = selectedItem.getBoundingClientRect();\n  const isAboveViewport =\n    selectedItemRect.top < containerRect.top + navigationScrollViewportPadding;\n  const isBelowViewport =\n    selectedItemRect.bottom > containerRect.bottom - navigationScrollViewportPadding;\n\n  if (isAboveViewport || isBelowViewport) {\n    const nextScrollTop =\n      scrollContainer.scrollTop +\n      (selectedItemRect.top - containerRect.top) -\n      scrollContainer.clientHeight * navigationScrollAnchorRatio +\n      selectedItemRect.height / 2;\n    const maxScrollTop = scrollContainer.scrollHeight - scrollContainer.clientHeight;\n\n    scrollContainer.scrollTo({\n      top: Math.min(Math.max(nextScrollTop, 0), maxScrollTop),\n      behavior: 'smooth',\n    });\n  }\n};\n\n/**\n * NavVerticalLayout\n * This component is used to render vertical navigations using\n * the Material-UI List component. It accepts the NavigationMenuProps props\n * and renders the nav items accordingly.\n */\nfunction NavVerticalLayout(props: NavigationMenuProps) {\n  const { navigation, active, dense, className, onItemClick, checkPermission, openedCollapseIds } =\n    props;\n  const navigationRef = useRef<HTMLUListElement>(null);\n\n  useEffect(() => {\n    const animationFrameId = window.requestAnimationFrame(() => {\n      if (navigationRef.current) {\n        scrollSelectedItemIntoView(navigationRef.current);\n      }\n    });\n\n    return () => {\n      window.cancelAnimationFrame(animationFrameId);\n    };\n  }, [openedCollapseIds]);\n\n  function handleItemClick(item: NavItemType) {\n    onItemClick?.(item);\n  }\n\n  return (\n    <StyledList\n      ref={navigationRef}\n      className={clsx(\n        'navigation whitespace-nowrap px-12 py-0',\n        `active-${active}-list`,\n        dense && 'dense',\n        className,\n      )}\n    >\n      {navigation.map((_item) => (\n        <NavItem\n          key={_item.id}\n          type={`vertical-${_item.type}`}\n          item={_item}\n          nestedLevel={0}\n          onItemClick={handleItemClick}\n          checkPermission={checkPermission}\n          openedCollapseIds={openedCollapseIds}\n        />\n      ))}\n    </StyledList>\n  );\n}\n\nexport { NavVerticalLayout };\n"],"names":["StyledList","styled","List","theme","selectedNavigationItemSelector","navigationScrollViewportPadding","navigationScrollAnchorRatio","getNavigationScrollContainer","__name","navigationElement","directParentElement","currentElement","scrollSelectedItemIntoView","selectedItems","selectedItem","scrollContainer","containerRect","selectedItemRect","isAboveViewport","isBelowViewport","nextScrollTop","maxScrollTop","NavVerticalLayout","props","navigation","active","dense","className","onItemClick","checkPermission","openedCollapseIds","navigationRef","useRef","useEffect","animationFrameId","handleItemClick","item","jsx","clsx","_item","NavItem"],"mappings":"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"}

package/dist/node_modules/.pnpm/jsbarcode@3.12.1/node_modules/jsbarcode/bin/barcodes/CODE128/constants.js

@@ -1,6 +1,6 @@
 var f = Object.defineProperty;
 var t = (e, _) => f(e, "name", { value: _, configurable: !0 });
-import { __exports as r } from "../../../../../../../../_virtual/constants.js";
+import { __exports as r } from "../../../../../../../../_virtual/constants2.js";
 var i;
 function E() {
   if (i) return r;

package/dist/node_modules/.pnpm/jsbarcode@3.12.1/node_modules/jsbarcode/bin/barcodes/EAN_UPC/constants.js

@@ -1,6 +1,6 @@
 var n = Object.defineProperty;
 var G = (r, t) => n(r, "name", { value: t, configurable: !0 });
-import { __exports as L } from "../../../../../../../../_virtual/constants2.js";
+import { __exports as L } from "../../../../../../../../_virtual/constants.js";
 var e;
 function o() {
   return e ? L : (e = 1, Object.defineProperty(L, "__esModule", {

package/dist/node_modules/.pnpm/jsbarcode@3.12.1/node_modules/jsbarcode/bin/renderers/index.js

@@ -1,6 +1,6 @@
 var v = Object.defineProperty;
 var _ = (a, t) => v(a, "name", { value: t, configurable: !0 });
-import { __exports as r } from "../../../../../../../_virtual/index5.js";
+import { __exports as r } from "../../../../../../../_virtual/index15.js";
 import { __require as f } from "./canvas.js";
 import { __require as q } from "./svg.js";
 import { __require as c } from "./object.js";

package/dist/node_modules/.pnpm/prop-types@15.8.1/node_modules/prop-types/index.js

@@ -1,6 +1,6 @@
 var t = Object.defineProperty;
 var i = (e, o) => t(e, "name", { value: o, configurable: !0 });
-import { __module as r } from "../../../../../_virtual/index16.js";
+import { __module as r } from "../../../../../_virtual/index17.js";
 import { __require as p } from "../../../react-is@16.13.1/node_modules/react-is/index.js";
 import { __require as u } from "./factoryWithTypeCheckers.js";
 import { __require as a } from "./factoryWithThrowingShims.js";

package/dist/node_modules/.pnpm/react-imask@7.6.1_react@19.2.4/node_modules/react-imask/esm/mixin.js

@@ -1,7 +1,7 @@
 var d = Object.defineProperty;
 var f = (n, a) => d(n, "name", { value: a, configurable: !0 });
 import r from "react";
-import e from "../../../../../../_virtual/index15.js";
+import e from "../../../../../../_virtual/index16.js";
 import "../../../../imask@7.6.1/node_modules/imask/esm/controls/input.js";
 import m from "../../../../imask@7.6.1/node_modules/imask/esm/core/holder.js";
 import "../../../../imask@7.6.1/node_modules/imask/esm/masked/factory.js";

package/dist/node_modules/.pnpm/react-is@16.13.1/node_modules/react-is/index.js

@@ -1,6 +1,6 @@
 var i = Object.defineProperty;
 var r = (t, s) => i(t, "name", { value: s, configurable: !0 });
-import { __module as e } from "../../../../../_virtual/index17.js";
+import { __module as e } from "../../../../../_virtual/index5.js";
 import { __require as u } from "./cjs/react-is.production.min.js";
 import { __require as p } from "./cjs/react-is.development.js";
 var o;

package/dist/node_modules/.pnpm/react-overlays@5.2.1_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-overlays/esm/Portal.js

@@ -1,6 +1,6 @@
 var c = Object.defineProperty;
 var a = (r, e) => c(r, "name", { value: e, configurable: !0 });
-import n from "../../../../../../_virtual/index15.js";
+import n from "../../../../../../_virtual/index16.js";
 import m from "react-dom";
 import t from "react";
 import u from "./useWaitForDOMRef.js";