@sellmate/design-system 0.0.7 → 0.0.8

package/dist/cjs/sd-tooltip-portal.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-D3QUS1Eb.js');
+var index = require('./index-iB3JlG0y.js');
 
 const SdTooltipPortal = class {
     constructor(hostRef) {

package/dist/cjs/{tooltipArrow-DKQk16So.js → tooltipArrow-CSLQDjwL.js}

@@ -1,10 +1,10 @@
 'use strict';
 
-var index = require('./index-D3QUS1Eb.js');
+var index = require('./index-iB3JlG0y.js');
 
 const TooltipArrow = (props) => (index.h("svg", { width: "16", height: "12", viewBox: "0 0 16 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, index.h("path", { d: "M8.83205 10.7519C8.43623 11.3457 7.56377 11.3457 7.16795 10.7519L1.04907e-06 -1.39876e-06L16 0L8.83205 10.7519Z", fill: "#07284A" })));
 
 exports.TooltipArrow = TooltipArrow;
-//# sourceMappingURL=tooltipArrow-DKQk16So.js.map
+//# sourceMappingURL=tooltipArrow-CSLQDjwL.js.map
 
-//# sourceMappingURL=tooltipArrow-DKQk16So.js.map
+//# sourceMappingURL=tooltipArrow-CSLQDjwL.js.map

package/dist/cjs/{tooltipArrow-DKQk16So.js.map → tooltipArrow-CSLQDjwL.js.map}

@@ -1 +1 @@
-{"version":3,"file":"tooltipArrow-DKQk16So.js","sources":["src/components/assets/tooltipArrow.tsx"],"sourcesContent":["import { h } from '@stencil/core';\r\n\r\nexport const TooltipArrow = (props: SVGProps) => (\r\n <svg\r\n  width=\"16\"\r\n  height=\"12\"\r\n  viewBox=\"0 0 16 12\"\r\n  fill=\"none\"\r\n  xmlns=\"http://www.w3.org/2000/svg\"\r\n  {...props}\r\n >\r\n  <path\r\n   d=\"M8.83205 10.7519C8.43623 11.3457 7.56377 11.3457 7.16795 10.7519L1.04907e-06 -1.39876e-06L16 0L8.83205 10.7519Z\"\r\n   fill=\"#07284A\"\r\n  />\r\n </svg>\r\n);\r\n"],"names":["h"],"mappings":";;;;AAEa,MAAA,YAAY,GAAG,CAAC,KAAe,MAC3CA,OACC,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,KAC9B,KAAK,EAAA,EAETA,OACC,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,iHAAiH,EACnH,IAAI,EAAC,SAAS,EAAA,CACb,CACG;;;;"}
+{"version":3,"file":"tooltipArrow-CSLQDjwL.js","sources":["src/components/assets/tooltipArrow.tsx"],"sourcesContent":["import { h } from '@stencil/core';\r\n\r\nexport const TooltipArrow = (props: SVGProps) => (\r\n <svg\r\n  width=\"16\"\r\n  height=\"12\"\r\n  viewBox=\"0 0 16 12\"\r\n  fill=\"none\"\r\n  xmlns=\"http://www.w3.org/2000/svg\"\r\n  {...props}\r\n >\r\n  <path\r\n   d=\"M8.83205 10.7519C8.43623 11.3457 7.56377 11.3457 7.16795 10.7519L1.04907e-06 -1.39876e-06L16 0L8.83205 10.7519Z\"\r\n   fill=\"#07284A\"\r\n  />\r\n </svg>\r\n);\r\n"],"names":["h"],"mappings":";;;;AAEa,MAAA,YAAY,GAAG,CAAC,KAAe,MAC3CA,OACC,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,KAC9B,KAAK,EAAA,EAETA,OACC,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,iHAAiH,EACnH,IAAI,EAAC,SAAS,EAAA,CACb,CACG;;;;"}

package/dist/collection/index.js

@@ -8,4 +8,8 @@
  * to consume components of this package as outlined in the `README.md`.
  */
 export { format } from './utils/utils';
+// Export Next.js utilities
+export { defineCustomElements, waitForStencilHydration, initStencilForNextjs, CLIENT_ONLY_COMPONENTS, isClientOnlyComponent, } from './utils/next-react-wrapper';
+// Export hydration utilities
+export { renderStencilComponents, hydrateStencilComponents, STENCIL_CONFIG, } from './utils/next-hydrate';
 //# sourceMappingURL=index.js.map

package/dist/collection/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC","sourcesContent":["/**\r\n * @fileoverview entry point for your component library\r\n *\r\n * This is the entry point for your component library. Use this file to export utilities,\r\n * constants or data structure that accompany your components.\r\n *\r\n * DO NOT use this file to export your components. Instead, use the recommended approaches\r\n * to consume components of this package as outlined in the `README.md`.\r\n */\r\n\r\nexport { format } from './utils/utils';\r\nexport type * from './components.d.ts';\r\n\r\n// Export sd-table types\r\nexport type { SdTableSortDir, SdTableColumn, Row } from './components/sd-table/sd-table';\r\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAMvC,2BAA2B;AAC3B,OAAO,EACN,oBAAoB,EACpB,uBAAuB,EACvB,oBAAoB,EACpB,sBAAsB,EACtB,qBAAqB,GACrB,MAAM,4BAA4B,CAAC;AAEpC,6BAA6B;AAC7B,OAAO,EACN,uBAAuB,EACvB,wBAAwB,EACxB,cAAc,GACd,MAAM,sBAAsB,CAAC","sourcesContent":["/**\r\n * @fileoverview entry point for your component library\r\n *\r\n * This is the entry point for your component library. Use this file to export utilities,\r\n * constants or data structure that accompany your components.\r\n *\r\n * DO NOT use this file to export your components. Instead, use the recommended approaches\r\n * to consume components of this package as outlined in the `README.md`.\r\n */\r\n\r\nexport { format } from './utils/utils';\r\nexport type * from './components.d.ts';\r\n\r\n// Export sd-table types\r\nexport type { SdTableSortDir, SdTableColumn, Row } from './components/sd-table/sd-table';\r\n\r\n// Export Next.js utilities\r\nexport {\r\n defineCustomElements,\r\n waitForStencilHydration,\r\n initStencilForNextjs,\r\n CLIENT_ONLY_COMPONENTS,\r\n isClientOnlyComponent,\r\n} from './utils/next-react-wrapper';\r\n\r\n// Export hydration utilities\r\nexport {\r\n renderStencilComponents,\r\n hydrateStencilComponents,\r\n STENCIL_CONFIG,\r\n} from './utils/next-hydrate';\r\n"]}

package/dist/collection/utils/next-hydrate.js

@@ -0,0 +1,52 @@
+/**
+ * Next.js SSR을 위한 서버사이드 렌더링 함수
+ * @param html HTML 문자열
+ * @returns 렌더링된 HTML 문자열
+ */
+export async function renderStencilComponents(html) {
+    // 서버 환경에서만 hydrate 모듈을 동적으로 import
+    if (typeof window === 'undefined') {
+        try {
+            const { renderToString } = await import('../../hydrate');
+            const results = await renderToString(html, {
+                prettyHtml: false,
+                removeUnusedStyles: true,
+                clientHydrateAnnotations: true,
+            });
+            return results.html || html;
+        }
+        catch (error) {
+            console.warn('Failed to render Stencil components on server:', error);
+            return html;
+        }
+    }
+    return html;
+}
+/**
+ * Next.js 클라이언트사이드 하이드레이션 함수
+ * @param document HTML 문서 객체
+ */
+export async function hydrateStencilComponents(document) {
+    // 클라이언트 환경에서만 hydrate 모듈을 동적으로 import
+    if (typeof window !== 'undefined') {
+        try {
+            const { hydrateDocument } = await import('../../hydrate');
+            await hydrateDocument(document, {
+                runtimeLogging: false,
+            });
+        }
+        catch (error) {
+            console.warn('Failed to hydrate Stencil components on client:', error);
+        }
+    }
+}
+/**
+ * Next.js에서 Stencil 컴포넌트 사용을 위한 설정
+ */
+export const STENCIL_CONFIG = {
+    // 컴포넌트가 hydrate되었는지 확인하는 속성
+    hydratedAttribute: 'hydrated',
+    // SSR에서 제외할 컴포넌트들 (클라이언트에서만 렌더링)
+    clientOnlyComponents: ['sd-date-picker', 'sd-date-range-picker'],
+};
+//# sourceMappingURL=next-hydrate.js.map

package/dist/collection/utils/next-hydrate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"next-hydrate.js","sourceRoot":"","sources":["../../src/utils/next-hydrate.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,MAAM,CAAC,KAAK,UAAU,uBAAuB,CAAC,IAAY;IACzD,mCAAmC;IACnC,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;QACnC,IAAI,CAAC;YACJ,MAAM,EAAE,cAAc,EAAE,GAAG,MAAM,MAAM,CAAC,eAAe,CAAC,CAAC;YACzD,MAAM,OAAO,GAAG,MAAM,cAAc,CAAC,IAAI,EAAE;gBAC1C,UAAU,EAAE,KAAK;gBACjB,kBAAkB,EAAE,IAAI;gBACxB,wBAAwB,EAAE,IAAI;aAC9B,CAAC,CAAC;YAEH,OAAO,OAAO,CAAC,IAAI,IAAI,IAAI,CAAC;QAC7B,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YAChB,OAAO,CAAC,IAAI,CAAC,gDAAgD,EAAE,KAAK,CAAC,CAAC;YACtE,OAAO,IAAI,CAAC;QACb,CAAC;IACF,CAAC;IAED,OAAO,IAAI,CAAC;AACb,CAAC;AAED;;;GAGG;AACH,MAAM,CAAC,KAAK,UAAU,wBAAwB,CAAC,QAAkB;IAChE,sCAAsC;IACtC,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;QACnC,IAAI,CAAC;YACJ,MAAM,EAAE,eAAe,EAAE,GAAG,MAAM,MAAM,CAAC,eAAe,CAAC,CAAC;YAC1D,MAAM,eAAe,CAAC,QAAQ,EAAE;gBAC/B,cAAc,EAAE,KAAK;aACrB,CAAC,CAAC;QACJ,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YAChB,OAAO,CAAC,IAAI,CAAC,iDAAiD,EAAE,KAAK,CAAC,CAAC;QACxE,CAAC;IACF,CAAC;AACF,CAAC;AAED;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG;IAC7B,4BAA4B;IAC5B,iBAAiB,EAAE,UAAU;IAE7B,iCAAiC;IACjC,oBAAoB,EAAE,CAAC,gBAAgB,EAAE,sBAAsB,CAAC;CAChE,CAAC","sourcesContent":["/**\r\n * Next.js SSR을 위한 서버사이드 렌더링 함수\r\n * @param html HTML 문자열\r\n * @returns 렌더링된 HTML 문자열\r\n */\r\nexport async function renderStencilComponents(html: string): Promise<string> {\r\n // 서버 환경에서만 hydrate 모듈을 동적으로 import\r\n if (typeof window === 'undefined') {\r\n  try {\r\n   const { renderToString } = await import('../../hydrate');\r\n   const results = await renderToString(html, {\r\n    prettyHtml: false,\r\n    removeUnusedStyles: true,\r\n    clientHydrateAnnotations: true,\r\n   });\r\n\r\n   return results.html || html;\r\n  } catch (error) {\r\n   console.warn('Failed to render Stencil components on server:', error);\r\n   return html;\r\n  }\r\n }\r\n\r\n return html;\r\n}\r\n\r\n/**\r\n * Next.js 클라이언트사이드 하이드레이션 함수\r\n * @param document HTML 문서 객체\r\n */\r\nexport async function hydrateStencilComponents(document: Document): Promise<void> {\r\n // 클라이언트 환경에서만 hydrate 모듈을 동적으로 import\r\n if (typeof window !== 'undefined') {\r\n  try {\r\n   const { hydrateDocument } = await import('../../hydrate');\r\n   await hydrateDocument(document, {\r\n    runtimeLogging: false,\r\n   });\r\n  } catch (error) {\r\n   console.warn('Failed to hydrate Stencil components on client:', error);\r\n  }\r\n }\r\n}\r\n\r\n/**\r\n * Next.js에서 Stencil 컴포넌트 사용을 위한 설정\r\n */\r\nexport const STENCIL_CONFIG = {\r\n // 컴포넌트가 hydrate되었는지 확인하는 속성\r\n hydratedAttribute: 'hydrated',\r\n\r\n // SSR에서 제외할 컴포넌트들 (클라이언트에서만 렌더링)\r\n clientOnlyComponents: ['sd-date-picker', 'sd-date-range-picker'],\r\n};\r\n"]}

package/dist/collection/utils/next-react-wrapper.js

@@ -0,0 +1,61 @@
+/**
+ * Next.js에서 Stencil 컴포넌트 사용을 위한 유틸리티 함수들
+ */
+/**
+ * 클라이언트 사이드에서만 Stencil 컴포넌트를 로드하는 함수
+ */
+export const defineCustomElements = async () => {
+    if (typeof window !== 'undefined') {
+        const { defineCustomElements } = await import('../../loader');
+        await defineCustomElements();
+    }
+};
+/**
+ * Stencil 컴포넌트가 hydrate되었는지 확인하는 함수
+ */
+export const waitForStencilHydration = (element, timeout = 5000) => {
+    return new Promise(resolve => {
+        if (element.hasAttribute('hydrated')) {
+            resolve(true);
+            return;
+        }
+        const observer = new MutationObserver(() => {
+            if (element.hasAttribute('hydrated')) {
+                observer.disconnect();
+                resolve(true);
+            }
+        });
+        observer.observe(element, {
+            attributes: true,
+            attributeFilter: ['hydrated'],
+        });
+        // 타임아웃 설정
+        setTimeout(() => {
+            observer.disconnect();
+            resolve(false);
+        }, timeout);
+    });
+};
+/**
+ * Next.js에서 Stencil 컴포넌트 초기화를 위한 설정
+ */
+export const initStencilForNextjs = () => {
+    if (typeof window !== 'undefined') {
+        // 전역 설정
+        window.stencil = {
+            ...(window.stencil || {}),
+            hydrateFlag: 'hydrated',
+        };
+    }
+};
+/**
+ * SSR에서 제외할 컴포넌트 목록
+ */
+export const CLIENT_ONLY_COMPONENTS = ['sd-date-picker', 'sd-date-range-picker'];
+/**
+ * 컴포넌트가 클라이언트 전용인지 확인
+ */
+export const isClientOnlyComponent = (tagName) => {
+    return CLIENT_ONLY_COMPONENTS.includes(tagName);
+};
+//# sourceMappingURL=next-react-wrapper.js.map

package/dist/collection/utils/next-react-wrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"next-react-wrapper.js","sourceRoot":"","sources":["../../src/utils/next-react-wrapper.tsx"],"names":[],"mappings":"AAAA;;GAEG;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,KAAK,IAAI,EAAE;IAC9C,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;QACnC,MAAM,EAAE,oBAAoB,EAAE,GAAG,MAAM,MAAM,CAAC,cAAc,CAAC,CAAC;QAC9D,MAAM,oBAAoB,EAAE,CAAC;IAC9B,CAAC;AACF,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,OAAoB,EAAE,OAAO,GAAG,IAAI,EAAoB,EAAE;IACjG,OAAO,IAAI,OAAO,CAAC,OAAO,CAAC,EAAE;QAC5B,IAAI,OAAO,CAAC,YAAY,CAAC,UAAU,CAAC,EAAE,CAAC;YACtC,OAAO,CAAC,IAAI,CAAC,CAAC;YACd,OAAO;QACR,CAAC;QAED,MAAM,QAAQ,GAAG,IAAI,gBAAgB,CAAC,GAAG,EAAE;YAC1C,IAAI,OAAO,CAAC,YAAY,CAAC,UAAU,CAAC,EAAE,CAAC;gBACtC,QAAQ,CAAC,UAAU,EAAE,CAAC;gBACtB,OAAO,CAAC,IAAI,CAAC,CAAC;YACf,CAAC;QACF,CAAC,CAAC,CAAC;QAEH,QAAQ,CAAC,OAAO,CAAC,OAAO,EAAE;YACzB,UAAU,EAAE,IAAI;YAChB,eAAe,EAAE,CAAC,UAAU,CAAC;SAC7B,CAAC,CAAC;QAEH,UAAU;QACV,UAAU,CAAC,GAAG,EAAE;YACf,QAAQ,CAAC,UAAU,EAAE,CAAC;YACtB,OAAO,CAAC,KAAK,CAAC,CAAC;QAChB,CAAC,EAAE,OAAO,CAAC,CAAC;IACb,CAAC,CAAC,CAAC;AACJ,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,GAAG,EAAE;IACxC,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;QACnC,QAAQ;QACP,MAAc,CAAC,OAAO,GAAG;YACzB,GAAG,CAAE,MAAc,CAAC,OAAO,IAAI,EAAE,CAAC;YAClC,WAAW,EAAE,UAAU;SACvB,CAAC;IACH,CAAC;AACF,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,gBAAgB,EAAE,sBAAsB,CAAC,CAAC;AAEjF;;GAEG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,OAAe,EAAW,EAAE;IACjE,OAAO,sBAAsB,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;AACjD,CAAC,CAAC","sourcesContent":["/**\r\n * Next.js에서 Stencil 컴포넌트 사용을 위한 유틸리티 함수들\r\n */\r\n\r\n/**\r\n * 클라이언트 사이드에서만 Stencil 컴포넌트를 로드하는 함수\r\n */\r\nexport const defineCustomElements = async () => {\r\n if (typeof window !== 'undefined') {\r\n  const { defineCustomElements } = await import('../../loader');\r\n  await defineCustomElements();\r\n }\r\n};\r\n\r\n/**\r\n * Stencil 컴포넌트가 hydrate되었는지 확인하는 함수\r\n */\r\nexport const waitForStencilHydration = (element: HTMLElement, timeout = 5000): Promise<boolean> => {\r\n return new Promise(resolve => {\r\n  if (element.hasAttribute('hydrated')) {\r\n   resolve(true);\r\n   return;\r\n  }\r\n\r\n  const observer = new MutationObserver(() => {\r\n   if (element.hasAttribute('hydrated')) {\r\n    observer.disconnect();\r\n    resolve(true);\r\n   }\r\n  });\r\n\r\n  observer.observe(element, {\r\n   attributes: true,\r\n   attributeFilter: ['hydrated'],\r\n  });\r\n\r\n  // 타임아웃 설정\r\n  setTimeout(() => {\r\n   observer.disconnect();\r\n   resolve(false);\r\n  }, timeout);\r\n });\r\n};\r\n\r\n/**\r\n * Next.js에서 Stencil 컴포넌트 초기화를 위한 설정\r\n */\r\nexport const initStencilForNextjs = () => {\r\n if (typeof window !== 'undefined') {\r\n  // 전역 설정\r\n  (window as any).stencil = {\r\n   ...((window as any).stencil || {}),\r\n   hydrateFlag: 'hydrated',\r\n  };\r\n }\r\n};\r\n\r\n/**\r\n * SSR에서 제외할 컴포넌트 목록\r\n */\r\nexport const CLIENT_ONLY_COMPONENTS = ['sd-date-picker', 'sd-date-range-picker'];\r\n\r\n/**\r\n * 컴포넌트가 클라이언트 전용인지 확인\r\n */\r\nexport const isClientOnlyComponent = (tagName: string): boolean => {\r\n return CLIENT_ONLY_COMPONENTS.includes(tagName);\r\n};\r\n"]}

package/dist/components/index.js

@@ -1,10 +1,123 @@
-export { g as getAssetPath, r as render, s as setAssetPath, a as setNonce, b as setPlatformOptions } from './p-C_ZLFIzZ.js';
+export { g as getAssetPath, r as render, s as setAssetPath, a as setNonce, b as setPlatformOptions } from './p-D_I5tXD6.js';
 
 function format(first, middle, last) {
     return (first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : '');
 }
 
-export { format };
+/**
+ * Next.js에서 Stencil 컴포넌트 사용을 위한 유틸리티 함수들
+ */
+/**
+ * 클라이언트 사이드에서만 Stencil 컴포넌트를 로드하는 함수
+ */
+const defineCustomElements = async () => {
+    if (typeof window !== 'undefined') {
+        const { defineCustomElements } = await import('./p-dBol_ZO8.js');
+        await defineCustomElements();
+    }
+};
+/**
+ * Stencil 컴포넌트가 hydrate되었는지 확인하는 함수
+ */
+const waitForStencilHydration = (element, timeout = 5000) => {
+    return new Promise(resolve => {
+        if (element.hasAttribute('hydrated')) {
+            resolve(true);
+            return;
+        }
+        const observer = new MutationObserver(() => {
+            if (element.hasAttribute('hydrated')) {
+                observer.disconnect();
+                resolve(true);
+            }
+        });
+        observer.observe(element, {
+            attributes: true,
+            attributeFilter: ['hydrated'],
+        });
+        // 타임아웃 설정
+        setTimeout(() => {
+            observer.disconnect();
+            resolve(false);
+        }, timeout);
+    });
+};
+/**
+ * Next.js에서 Stencil 컴포넌트 초기화를 위한 설정
+ */
+const initStencilForNextjs = () => {
+    if (typeof window !== 'undefined') {
+        // 전역 설정
+        window.stencil = {
+            ...(window.stencil || {}),
+            hydrateFlag: 'hydrated',
+        };
+    }
+};
+/**
+ * SSR에서 제외할 컴포넌트 목록
+ */
+const CLIENT_ONLY_COMPONENTS = ['sd-date-picker', 'sd-date-range-picker'];
+/**
+ * 컴포넌트가 클라이언트 전용인지 확인
+ */
+const isClientOnlyComponent = (tagName) => {
+    return CLIENT_ONLY_COMPONENTS.includes(tagName);
+};
+
+/**
+ * Next.js SSR을 위한 서버사이드 렌더링 함수
+ * @param html HTML 문자열
+ * @returns 렌더링된 HTML 문자열
+ */
+async function renderStencilComponents(html) {
+    // 서버 환경에서만 hydrate 모듈을 동적으로 import
+    if (typeof window === 'undefined') {
+        try {
+            const { renderToString } = await import('./p-BjTJkvEh.js');
+            const results = await renderToString(html, {
+                prettyHtml: false,
+                removeUnusedStyles: true,
+                clientHydrateAnnotations: true,
+            });
+            return results.html || html;
+        }
+        catch (error) {
+            console.warn('Failed to render Stencil components on server:', error);
+            return html;
+        }
+    }
+    return html;
+}
+/**
+ * Next.js 클라이언트사이드 하이드레이션 함수
+ * @param document HTML 문서 객체
+ */
+async function hydrateStencilComponents(document) {
+    // 클라이언트 환경에서만 hydrate 모듈을 동적으로 import
+    if (typeof window !== 'undefined') {
+        try {
+            const { hydrateDocument } = await import('./p-BjTJkvEh.js');
+            await hydrateDocument(document, {
+                runtimeLogging: false,
+            });
+        }
+        catch (error) {
+            console.warn('Failed to hydrate Stencil components on client:', error);
+        }
+    }
+}
+/**
+ * Next.js에서 Stencil 컴포넌트 사용을 위한 설정
+ */
+const STENCIL_CONFIG = {
+    // 컴포넌트가 hydrate되었는지 확인하는 속성
+    hydratedAttribute: 'hydrated',
+    // SSR에서 제외할 컴포넌트들 (클라이언트에서만 렌더링)
+    clientOnlyComponents: ['sd-date-picker', 'sd-date-range-picker'],
+};
+
+export { CLIENT_ONLY_COMPONENTS, STENCIL_CONFIG, defineCustomElements, format, hydrateStencilComponents, initStencilForNextjs, isClientOnlyComponent, renderStencilComponents, waitForStencilHydration };
 //# sourceMappingURL=index.js.map
 
 //# sourceMappingURL=index.js.map

package/dist/components/index.js.map

@@ -1 +1 @@
-{"file":"index.js","mappings":";;SAAgB,MAAM,CAAC,KAAc,EAAE,MAAe,EAAE,IAAa,EAAA;AACnE,IAAA,OAAO,CAAC,KAAK,IAAI,EAAE,KAAK,MAAM,GAAG,CAAI,CAAA,EAAA,MAAM,EAAE,GAAG,EAAE,CAAC,IAAI,IAAI,GAAG,CAAI,CAAA,EAAA,IAAI,EAAE,GAAG,EAAE,CAAC;AAChF;;;;","names":[],"sources":["src/utils/utils.ts"],"sourcesContent":["export function format(first?: string, middle?: string, last?: string): string {\r\n  return (first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : '');\r\n}\r\n"],"version":3}
+{"file":"index.js","mappings":"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","names":[],"sources":["src/utils/utils.ts","src/utils/next-react-wrapper.tsx","src/utils/next-hydrate.ts"],"sourcesContent":["export function format(first?: string, middle?: string, last?: string): string {\r\n  return (first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : '');\r\n}\r\n","/**\r\n * Next.js에서 Stencil 컴포넌트 사용을 위한 유틸리티 함수들\r\n */\r\n\r\n/**\r\n * 클라이언트 사이드에서만 Stencil 컴포넌트를 로드하는 함수\r\n */\r\nexport const defineCustomElements = async () => {\r\n if (typeof window !== 'undefined') {\r\n  const { defineCustomElements } = await import('../../loader');\r\n  await defineCustomElements();\r\n }\r\n};\r\n\r\n/**\r\n * Stencil 컴포넌트가 hydrate되었는지 확인하는 함수\r\n */\r\nexport const waitForStencilHydration = (element: HTMLElement, timeout = 5000): Promise<boolean> => {\r\n return new Promise(resolve => {\r\n  if (element.hasAttribute('hydrated')) {\r\n   resolve(true);\r\n   return;\r\n  }\r\n\r\n  const observer = new MutationObserver(() => {\r\n   if (element.hasAttribute('hydrated')) {\r\n    observer.disconnect();\r\n    resolve(true);\r\n   }\r\n  });\r\n\r\n  observer.observe(element, {\r\n   attributes: true,\r\n   attributeFilter: ['hydrated'],\r\n  });\r\n\r\n  // 타임아웃 설정\r\n  setTimeout(() => {\r\n   observer.disconnect();\r\n   resolve(false);\r\n  }, timeout);\r\n });\r\n};\r\n\r\n/**\r\n * Next.js에서 Stencil 컴포넌트 초기화를 위한 설정\r\n */\r\nexport const initStencilForNextjs = () => {\r\n if (typeof window !== 'undefined') {\r\n  // 전역 설정\r\n  (window as any).stencil = {\r\n   ...((window as any).stencil || {}),\r\n   hydrateFlag: 'hydrated',\r\n  };\r\n }\r\n};\r\n\r\n/**\r\n * SSR에서 제외할 컴포넌트 목록\r\n */\r\nexport const CLIENT_ONLY_COMPONENTS = ['sd-date-picker', 'sd-date-range-picker'];\r\n\r\n/**\r\n * 컴포넌트가 클라이언트 전용인지 확인\r\n */\r\nexport const isClientOnlyComponent = (tagName: string): boolean => {\r\n return CLIENT_ONLY_COMPONENTS.includes(tagName);\r\n};\r\n","/**\r\n * Next.js SSR을 위한 서버사이드 렌더링 함수\r\n * @param html HTML 문자열\r\n * @returns 렌더링된 HTML 문자열\r\n */\r\nexport async function renderStencilComponents(html: string): Promise<string> {\r\n // 서버 환경에서만 hydrate 모듈을 동적으로 import\r\n if (typeof window === 'undefined') {\r\n  try {\r\n   const { renderToString } = await import('../../hydrate');\r\n   const results = await renderToString(html, {\r\n    prettyHtml: false,\r\n    removeUnusedStyles: true,\r\n    clientHydrateAnnotations: true,\r\n   });\r\n\r\n   return results.html || html;\r\n  } catch (error) {\r\n   console.warn('Failed to render Stencil components on server:', error);\r\n   return html;\r\n  }\r\n }\r\n\r\n return html;\r\n}\r\n\r\n/**\r\n * Next.js 클라이언트사이드 하이드레이션 함수\r\n * @param document HTML 문서 객체\r\n */\r\nexport async function hydrateStencilComponents(document: Document): Promise<void> {\r\n // 클라이언트 환경에서만 hydrate 모듈을 동적으로 import\r\n if (typeof window !== 'undefined') {\r\n  try {\r\n   const { hydrateDocument } = await import('../../hydrate');\r\n   await hydrateDocument(document, {\r\n    runtimeLogging: false,\r\n   });\r\n  } catch (error) {\r\n   console.warn('Failed to hydrate Stencil components on client:', error);\r\n  }\r\n }\r\n}\r\n\r\n/**\r\n * Next.js에서 Stencil 컴포넌트 사용을 위한 설정\r\n */\r\nexport const STENCIL_CONFIG = {\r\n // 컴포넌트가 hydrate되었는지 확인하는 속성\r\n hydratedAttribute: 'hydrated',\r\n\r\n // SSR에서 제외할 컴포넌트들 (클라이언트에서만 렌더링)\r\n clientOnlyComponents: ['sd-date-picker', 'sd-date-range-picker'],\r\n};\r\n"],"version":3}

package/dist/components/{p-BBcRxAHQ.js → p-B0--8AFP.js}

@@ -1,4 +1,4 @@
-import { h, p as proxyCustomElement, H } from './p-C_ZLFIzZ.js';
+import { h, p as proxyCustomElement, H } from './p-D_I5tXD6.js';
 
 const primary = "#051d36";
 const secondary = "#555555";
@@ -602,6 +602,6 @@ function defineCustomElement() {
 }
 
 export { SdIcon as S, colors$1 as c, defineCustomElement as d, resolveColor as r };
-//# sourceMappingURL=p-BBcRxAHQ.js.map
+//# sourceMappingURL=p-B0--8AFP.js.map
 
-//# sourceMappingURL=p-BBcRxAHQ.js.map
+//# sourceMappingURL=p-B0--8AFP.js.map