@withwiz/gallery 0.1.0

package/dist/hooks/index.d.mts

@@ -0,0 +1,65 @@
+import { DragEvent, ChangeEvent } from 'react';
+export { L as LightboxImage, U as UseGalleryLightboxReturn, u as useGalleryLightbox } from '../useGalleryLightbox-BYzPyBYB.mjs';
+
+/** IntersectionObserver 기반 스크롤 reveal hook.
+ *
+ *  - SSR safe: `typeof window === "undefined"` 이면 effect 가 nothing.
+ *  - jsdom 등 `IntersectionObserver` 미정의 환경에서도 effect 가 nothing (가드).
+ *  - `once: true` (default) — 한번 visible 후 unobserve, 이후 다시 false 로 돌아가지 않음.
+ *  - `once: false` — visible 진입/이탈에 따라 toggle.
+ *
+ *  반환되는 ref 는 React 19 의 `RefObject<HTMLElement | null>` 시그니처 — host 가 어떤
+ *  구체 element 타입에든 마운트 가능하도록 광폭 타입을 둔다.
+ */
+declare function useScrollReveal(opts?: {
+    threshold?: number;
+    once?: boolean;
+}): {
+    ref: React.RefObject<HTMLElement | null>;
+    isVisible: boolean;
+};
+
+type ImageDropZoneValidate = (file: File) => {
+    ok: true;
+} | {
+    ok: false;
+    reason: string;
+};
+interface UseImageDropZoneOptions {
+    /** drop / file picker change 로 통과한 파일들이 전달되는 콜백. */
+    onFiles: (files: File[]) => void | Promise<void>;
+    /** 허용 MIME 타입. 기본 ["image/jpeg", "image/png", "image/webp"]. */
+    accept?: string[];
+    /** 파일당 최대 바이트. 기본 10 * 1024 * 1024 (10MB). */
+    maxSize?: number;
+    /** 다중 선택 허용. 기본 true. false 이면 첫 파일만 통과. */
+    multiple?: boolean;
+    /** host 가 추가 검증을 끼울 수 있는 hook. accept/maxSize 검증 통과 후 호출. */
+    validate?: ImageDropZoneValidate;
+    /** true 이면 모든 드래그/드롭/체인지 콜백이 no-op. */
+    disabled?: boolean;
+}
+interface UseImageDropZoneReturn {
+    /** 현재 드래그 over 상태. */
+    isDragging: boolean;
+    /** 드롭 영역에 전개할 prop 집합. */
+    dropProps: {
+        onDragEnter: (e: DragEvent) => void;
+        onDragOver: (e: DragEvent) => void;
+        onDragLeave: (e: DragEvent) => void;
+        onDrop: (e: DragEvent) => void;
+    };
+    /** `<input type="file">` 에 전개할 prop 집합. */
+    inputProps: {
+        type: "file";
+        accept: string;
+        multiple: boolean;
+        onChange: (e: ChangeEvent<HTMLInputElement>) => void;
+    };
+    /** 직전 drop / change 에서 reject 된 파일들의 사유. 매 새 이벤트마다 초기화. */
+    rejectedReasons: string[];
+}
+/** host 독립 이미지 드롭존 hook. 업로드 자체는 수행하지 않고 검증 통과 파일만 onFiles 로 위임. */
+declare function useImageDropZone(opts: UseImageDropZoneOptions): UseImageDropZoneReturn;
+
+export { type ImageDropZoneValidate, type UseImageDropZoneOptions, type UseImageDropZoneReturn, useImageDropZone, useScrollReveal };

package/dist/hooks/index.d.ts

@@ -0,0 +1,65 @@
+import { DragEvent, ChangeEvent } from 'react';
+export { L as LightboxImage, U as UseGalleryLightboxReturn, u as useGalleryLightbox } from '../useGalleryLightbox-BYzPyBYB.js';
+
+/** IntersectionObserver 기반 스크롤 reveal hook.
+ *
+ *  - SSR safe: `typeof window === "undefined"` 이면 effect 가 nothing.
+ *  - jsdom 등 `IntersectionObserver` 미정의 환경에서도 effect 가 nothing (가드).
+ *  - `once: true` (default) — 한번 visible 후 unobserve, 이후 다시 false 로 돌아가지 않음.
+ *  - `once: false` — visible 진입/이탈에 따라 toggle.
+ *
+ *  반환되는 ref 는 React 19 의 `RefObject<HTMLElement | null>` 시그니처 — host 가 어떤
+ *  구체 element 타입에든 마운트 가능하도록 광폭 타입을 둔다.
+ */
+declare function useScrollReveal(opts?: {
+    threshold?: number;
+    once?: boolean;
+}): {
+    ref: React.RefObject<HTMLElement | null>;
+    isVisible: boolean;
+};
+
+type ImageDropZoneValidate = (file: File) => {
+    ok: true;
+} | {
+    ok: false;
+    reason: string;
+};
+interface UseImageDropZoneOptions {
+    /** drop / file picker change 로 통과한 파일들이 전달되는 콜백. */
+    onFiles: (files: File[]) => void | Promise<void>;
+    /** 허용 MIME 타입. 기본 ["image/jpeg", "image/png", "image/webp"]. */
+    accept?: string[];
+    /** 파일당 최대 바이트. 기본 10 * 1024 * 1024 (10MB). */
+    maxSize?: number;
+    /** 다중 선택 허용. 기본 true. false 이면 첫 파일만 통과. */
+    multiple?: boolean;
+    /** host 가 추가 검증을 끼울 수 있는 hook. accept/maxSize 검증 통과 후 호출. */
+    validate?: ImageDropZoneValidate;
+    /** true 이면 모든 드래그/드롭/체인지 콜백이 no-op. */
+    disabled?: boolean;
+}
+interface UseImageDropZoneReturn {
+    /** 현재 드래그 over 상태. */
+    isDragging: boolean;
+    /** 드롭 영역에 전개할 prop 집합. */
+    dropProps: {
+        onDragEnter: (e: DragEvent) => void;
+        onDragOver: (e: DragEvent) => void;
+        onDragLeave: (e: DragEvent) => void;
+        onDrop: (e: DragEvent) => void;
+    };
+    /** `<input type="file">` 에 전개할 prop 집합. */
+    inputProps: {
+        type: "file";
+        accept: string;
+        multiple: boolean;
+        onChange: (e: ChangeEvent<HTMLInputElement>) => void;
+    };
+    /** 직전 drop / change 에서 reject 된 파일들의 사유. 매 새 이벤트마다 초기화. */
+    rejectedReasons: string[];
+}
+/** host 독립 이미지 드롭존 hook. 업로드 자체는 수행하지 않고 검증 통과 파일만 onFiles 로 위임. */
+declare function useImageDropZone(opts: UseImageDropZoneOptions): UseImageDropZoneReturn;
+
+export { type ImageDropZoneValidate, type UseImageDropZoneOptions, type UseImageDropZoneReturn, useImageDropZone, useScrollReveal };

package/dist/hooks/index.js

@@ -0,0 +1,14 @@
+"use client";
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunkM7CCTDUGjs = require('../chunk-M7CCTDUG.js');
+
+
+
+var _chunkXSPWM4DDjs = require('../chunk-XSPWM4DD.js');
+
+
+
+
+exports.useGalleryLightbox = _chunkXSPWM4DDjs.useGalleryLightbox; exports.useImageDropZone = _chunkM7CCTDUGjs.useImageDropZone; exports.useScrollReveal = _chunkXSPWM4DDjs.useScrollReveal;
+//# sourceMappingURL=index.js.map

package/dist/hooks/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/Users/uni4love/project/workspace/211-withwiz/node-packages/withwiz-gallery/dist/hooks/index.js"],"names":[],"mappings":"AAAA;AACE;AACF,uDAA6B;AAC7B;AACE;AACA;AACF,uDAA6B;AAC7B;AACE;AACA;AACA;AACF,2LAAC","file":"/Users/uni4love/project/workspace/211-withwiz/node-packages/withwiz-gallery/dist/hooks/index.js"}

package/dist/hooks/index.mjs

@@ -0,0 +1,14 @@
+"use client";
+import {
+  useImageDropZone
+} from "../chunk-BC3TPJQY.mjs";
+import {
+  useGalleryLightbox,
+  useScrollReveal
+} from "../chunk-B3MQL6ZR.mjs";
+export {
+  useGalleryLightbox,
+  useImageDropZone,
+  useScrollReveal
+};
+//# sourceMappingURL=index.mjs.map

package/dist/hooks/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/index.d.mts

@@ -0,0 +1,17 @@
+export { C as CategoryInUseError, a as CategoryNotFoundError, G as GalleryError, b as GalleryNotFoundError, P as PermissionDeniedError, g as getGalleryConfig, s as setGalleryConfig } from './errors-DYrlDCzP.mjs';
+export { ApiContext, ApiWrapper, CreateCategoryInput, CreateGalleryInput, GalleryCategoryItem, GalleryConfig, GalleryDetail, GalleryI18nKey, GalleryListItem, GallerySlotName, PaginatedResult, PaginationMeta, PrismaLike, RouteHandler, SortOrder, UpdateCategoryInput, UpdateGalleryInput } from './types/index.mjs';
+import { ClassValue } from 'clsx';
+import 'next/server';
+import 'react';
+
+declare function cn(...inputs: ClassValue[]): string;
+
+type ImageVariant = "lg" | "md" | "sm" | "thumb";
+/** URL 의 파일 확장자 앞에 variant suffix 를 삽입.
+ *  - "lg" 는 원본을 그대로 반환 (관례)
+ *  - 확장자 없는 경로는 그대로 반환
+ *  예: getVariantUrl("/a/b.webp", "md") -> "/a/b_md.webp"
+ */
+declare function getVariantUrl(url: string, variant: ImageVariant): string;
+
+export { type ImageVariant, cn, getVariantUrl };

package/dist/index.d.ts

@@ -0,0 +1,17 @@
+export { C as CategoryInUseError, a as CategoryNotFoundError, G as GalleryError, b as GalleryNotFoundError, P as PermissionDeniedError, g as getGalleryConfig, s as setGalleryConfig } from './errors-B9gzUsX-.js';
+export { ApiContext, ApiWrapper, CreateCategoryInput, CreateGalleryInput, GalleryCategoryItem, GalleryConfig, GalleryDetail, GalleryI18nKey, GalleryListItem, GallerySlotName, PaginatedResult, PaginationMeta, PrismaLike, RouteHandler, SortOrder, UpdateCategoryInput, UpdateGalleryInput } from './types/index.js';
+import { ClassValue } from 'clsx';
+import 'next/server';
+import 'react';
+
+declare function cn(...inputs: ClassValue[]): string;
+
+type ImageVariant = "lg" | "md" | "sm" | "thumb";
+/** URL 의 파일 확장자 앞에 variant suffix 를 삽입.
+ *  - "lg" 는 원본을 그대로 반환 (관례)
+ *  - 확장자 없는 경로는 그대로 반환
+ *  예: getVariantUrl("/a/b.webp", "md") -> "/a/b_md.webp"
+ */
+declare function getVariantUrl(url: string, variant: ImageVariant): string;
+
+export { type ImageVariant, cn, getVariantUrl };

package/dist/index.js

@@ -0,0 +1,37 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+
+
+
+
+var _chunkGFOWZGJXjs = require('./chunk-GFOWZGJX.js');
+
+
+
+var _chunkWVRTM6E7js = require('./chunk-WVRTM6E7.js');
+
+
+var _chunkXLPMNJJVjs = require('./chunk-XLPMNJJV.js');
+
+// src/utils/image-variants.ts
+function getVariantUrl(url, variant) {
+  if (variant === "lg") return url;
+  const dotIdx = url.lastIndexOf(".");
+  const slashIdx = url.lastIndexOf("/");
+  if (dotIdx === -1 || dotIdx < slashIdx) return url;
+  const base = url.slice(0, dotIdx);
+  const ext = url.slice(dotIdx);
+  return `${base}_${variant}${ext}`;
+}
+
+
+
+
+
+
+
+
+
+
+exports.CategoryInUseError = _chunkGFOWZGJXjs.CategoryInUseError; exports.CategoryNotFoundError = _chunkGFOWZGJXjs.CategoryNotFoundError; exports.GalleryError = _chunkGFOWZGJXjs.GalleryError; exports.GalleryNotFoundError = _chunkGFOWZGJXjs.GalleryNotFoundError; exports.PermissionDeniedError = _chunkGFOWZGJXjs.PermissionDeniedError; exports.cn = _chunkXLPMNJJVjs.cn; exports.getGalleryConfig = _chunkWVRTM6E7js.getGalleryConfig; exports.getVariantUrl = getVariantUrl; exports.setGalleryConfig = _chunkWVRTM6E7js.setGalleryConfig;
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/Users/uni4love/project/workspace/211-withwiz/node-packages/withwiz-gallery/dist/index.js","../src/utils/image-variants.ts"],"names":[],"mappings":"AAAA;AACE;AACA;AACA;AACA;AACA;AACF,sDAA4B;AAC5B;AACE;AACA;AACF,sDAA4B;AAC5B;AACE;AACF,sDAA4B;AAC5B;AACA;ACRO,SAAS,aAAA,CAAc,GAAA,EAAa,OAAA,EAA+B;AACxE,EAAA,GAAA,CAAI,QAAA,IAAY,IAAA,EAAM,OAAO,GAAA;AAC7B,EAAA,MAAM,OAAA,EAAS,GAAA,CAAI,WAAA,CAAY,GAAG,CAAA;AAClC,EAAA,MAAM,SAAA,EAAW,GAAA,CAAI,WAAA,CAAY,GAAG,CAAA;AACpC,EAAA,GAAA,CAAI,OAAA,IAAW,CAAA,EAAA,GAAM,OAAA,EAAS,QAAA,EAAU,OAAO,GAAA;AAC/C,EAAA,MAAM,KAAA,EAAO,GAAA,CAAI,KAAA,CAAM,CAAA,EAAG,MAAM,CAAA;AAChC,EAAA,MAAM,IAAA,EAAM,GAAA,CAAI,KAAA,CAAM,MAAM,CAAA;AAC5B,EAAA,OAAO,CAAA,EAAA;AACT;ADUU;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"/Users/uni4love/project/workspace/211-withwiz/node-packages/withwiz-gallery/dist/index.js","sourcesContent":[null,"export type ImageVariant = \"lg\" | \"md\" | \"sm\" | \"thumb\";\n\n/** URL 의 파일 확장자 앞에 variant suffix 를 삽입.\n *  - \"lg\" 는 원본을 그대로 반환 (관례)\n *  - 확장자 없는 경로는 그대로 반환\n *  예: getVariantUrl(\"/a/b.webp\", \"md\") -> \"/a/b_md.webp\"\n */\nexport function getVariantUrl(url: string, variant: ImageVariant): string {\n  if (variant === \"lg\") return url;\n  const dotIdx = url.lastIndexOf(\".\");\n  const slashIdx = url.lastIndexOf(\"/\");\n  if (dotIdx === -1 || dotIdx < slashIdx) return url;\n  const base = url.slice(0, dotIdx);\n  const ext = url.slice(dotIdx);\n  return `${base}_${variant}${ext}`;\n}\n"]}

package/dist/index.mjs

@@ -0,0 +1,37 @@
+import {
+  CategoryInUseError,
+  CategoryNotFoundError,
+  GalleryError,
+  GalleryNotFoundError,
+  PermissionDeniedError
+} from "./chunk-GDUGKVDQ.mjs";
+import {
+  getGalleryConfig,
+  setGalleryConfig
+} from "./chunk-ZEZCUJJD.mjs";
+import {
+  cn
+} from "./chunk-BTLELFKC.mjs";
+
+// src/utils/image-variants.ts
+function getVariantUrl(url, variant) {
+  if (variant === "lg") return url;
+  const dotIdx = url.lastIndexOf(".");
+  const slashIdx = url.lastIndexOf("/");
+  if (dotIdx === -1 || dotIdx < slashIdx) return url;
+  const base = url.slice(0, dotIdx);
+  const ext = url.slice(dotIdx);
+  return `${base}_${variant}${ext}`;
+}
+export {
+  CategoryInUseError,
+  CategoryNotFoundError,
+  GalleryError,
+  GalleryNotFoundError,
+  PermissionDeniedError,
+  cn,
+  getGalleryConfig,
+  getVariantUrl,
+  setGalleryConfig
+};
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/utils/image-variants.ts"],"sourcesContent":["export type ImageVariant = \"lg\" | \"md\" | \"sm\" | \"thumb\";\n\n/** URL 의 파일 확장자 앞에 variant suffix 를 삽입.\n *  - \"lg\" 는 원본을 그대로 반환 (관례)\n *  - 확장자 없는 경로는 그대로 반환\n *  예: getVariantUrl(\"/a/b.webp\", \"md\") -> \"/a/b_md.webp\"\n */\nexport function getVariantUrl(url: string, variant: ImageVariant): string {\n  if (variant === \"lg\") return url;\n  const dotIdx = url.lastIndexOf(\".\");\n  const slashIdx = url.lastIndexOf(\"/\");\n  if (dotIdx === -1 || dotIdx < slashIdx) return url;\n  const base = url.slice(0, dotIdx);\n  const ext = url.slice(dotIdx);\n  return `${base}_${variant}${ext}`;\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAOO,SAAS,cAAc,KAAa,SAA+B;AACxE,MAAI,YAAY,KAAM,QAAO;AAC7B,QAAM,SAAS,IAAI,YAAY,GAAG;AAClC,QAAM,WAAW,IAAI,YAAY,GAAG;AACpC,MAAI,WAAW,MAAM,SAAS,SAAU,QAAO;AAC/C,QAAM,OAAO,IAAI,MAAM,GAAG,MAAM;AAChC,QAAM,MAAM,IAAI,MAAM,MAAM;AAC5B,SAAO,GAAG,IAAI,IAAI,OAAO,GAAG,GAAG;AACjC;","names":[]}

package/dist/presets/ballet.d.mts

@@ -0,0 +1,64 @@
+import { JSX } from 'react';
+import { L as LightboxImage } from '../useGalleryLightbox-BYzPyBYB.mjs';
+
+/**
+ * @withwiz/gallery/presets/ballet
+ *
+ * 발레용 reference public 컴포넌트. ballet 의
+ *   `src/components/sections/Gallery.tsx`
+ * 의 모자이크 + 라이트박스 결합을 host 독립으로 추출.
+ *
+ * 사용 예 (host RSC + client mount):
+ *
+ *   import { PublicGalleryMosaic } from "@withwiz/gallery/presets/ballet";
+ *   import { getFeaturedGalleries } from "@withwiz/gallery/server";
+ *   import "@withwiz/gallery/components/gallery.css";
+ *
+ *   export default async function HomePage() {
+ *     const featured = await getFeaturedGalleries(config, 7);
+ *     const images = featured.map((g) => ({ src: g.imageUrl, alt: g.caption ?? "갤러리" }));
+ *     return <PublicGalleryMosaic images={images} count={7} />;
+ *   }
+ *
+ * yeroom 등 다른 host 는 이 preset 을 fork 하거나 `useGalleryLightbox` hook 만
+ * 가져다 직접 그릴 수 있다.
+ *
+ * Host-independence:
+ *   - `next/image`, `next/navigation`, `useI18n`, `@withwiz/pms` 등 직접 의존 0
+ *   - 이미지는 plain `<img>` 사용. host 가 next/image 로 그리고 싶다면 fork.
+ *   - 모든 라벨은 props.i18n 으로만 (fallback 한글).
+ */
+
+declare const FALLBACK_I18N: {
+    readonly sectionLabel: "갤러리";
+    readonly moments: "공연의 순간들";
+    readonly expandAria: "이미지 확대";
+    readonly lbClose: "닫기";
+    readonly lbPrev: "이전 이미지";
+    readonly lbNext: "다음 이미지";
+};
+interface PublicGalleryMosaicProps {
+    /** 표시할 이미지 목록 (host 가 loaders 등에서 받아온 src/alt 매핑) */
+    images: LightboxImage[];
+    /** 모자이크 그리드 칸 수 (default 7). images.length > count 이면 slice. */
+    count?: number;
+    /** UI 라벨 i18n override. 미주입 키는 한글 fallback. */
+    i18n?: Partial<Record<keyof typeof FALLBACK_I18N, string>>;
+    /** 외부 className 추가 */
+    className?: string;
+    /** 스크롤 reveal (IntersectionObserver) 사용 여부 (default true). false 면 즉시 visible. */
+    scrollReveal?: boolean;
+    /** 섹션 헤더 비노출 (default false). host 가 자체 헤더를 두는 경우 true. */
+    hideHeader?: boolean;
+}
+/**
+ * 발레 home gallery 의 모자이크 + 라이트박스.
+ *
+ *   - useGalleryLightbox 가 ESC / Arrow 키바인딩과 wrap-around 를 담당.
+ *   - useScrollReveal 로 fade-in (scrollReveal=true 일 때).
+ *   - lightbox open 시 body scroll lock (overflow:hidden).
+ *   - images 가 빈 배열이면 null 반환.
+ */
+declare function PublicGalleryMosaic(props: PublicGalleryMosaicProps): JSX.Element | null;
+
+export { PublicGalleryMosaic, type PublicGalleryMosaicProps };

package/dist/presets/ballet.d.ts

@@ -0,0 +1,64 @@
+import { JSX } from 'react';
+import { L as LightboxImage } from '../useGalleryLightbox-BYzPyBYB.js';
+
+/**
+ * @withwiz/gallery/presets/ballet
+ *
+ * 발레용 reference public 컴포넌트. ballet 의
+ *   `src/components/sections/Gallery.tsx`
+ * 의 모자이크 + 라이트박스 결합을 host 독립으로 추출.
+ *
+ * 사용 예 (host RSC + client mount):
+ *
+ *   import { PublicGalleryMosaic } from "@withwiz/gallery/presets/ballet";
+ *   import { getFeaturedGalleries } from "@withwiz/gallery/server";
+ *   import "@withwiz/gallery/components/gallery.css";
+ *
+ *   export default async function HomePage() {
+ *     const featured = await getFeaturedGalleries(config, 7);
+ *     const images = featured.map((g) => ({ src: g.imageUrl, alt: g.caption ?? "갤러리" }));
+ *     return <PublicGalleryMosaic images={images} count={7} />;
+ *   }
+ *
+ * yeroom 등 다른 host 는 이 preset 을 fork 하거나 `useGalleryLightbox` hook 만
+ * 가져다 직접 그릴 수 있다.
+ *
+ * Host-independence:
+ *   - `next/image`, `next/navigation`, `useI18n`, `@withwiz/pms` 등 직접 의존 0
+ *   - 이미지는 plain `<img>` 사용. host 가 next/image 로 그리고 싶다면 fork.
+ *   - 모든 라벨은 props.i18n 으로만 (fallback 한글).
+ */
+
+declare const FALLBACK_I18N: {
+    readonly sectionLabel: "갤러리";
+    readonly moments: "공연의 순간들";
+    readonly expandAria: "이미지 확대";
+    readonly lbClose: "닫기";
+    readonly lbPrev: "이전 이미지";
+    readonly lbNext: "다음 이미지";
+};
+interface PublicGalleryMosaicProps {
+    /** 표시할 이미지 목록 (host 가 loaders 등에서 받아온 src/alt 매핑) */
+    images: LightboxImage[];
+    /** 모자이크 그리드 칸 수 (default 7). images.length > count 이면 slice. */
+    count?: number;
+    /** UI 라벨 i18n override. 미주입 키는 한글 fallback. */
+    i18n?: Partial<Record<keyof typeof FALLBACK_I18N, string>>;
+    /** 외부 className 추가 */
+    className?: string;
+    /** 스크롤 reveal (IntersectionObserver) 사용 여부 (default true). false 면 즉시 visible. */
+    scrollReveal?: boolean;
+    /** 섹션 헤더 비노출 (default false). host 가 자체 헤더를 두는 경우 true. */
+    hideHeader?: boolean;
+}
+/**
+ * 발레 home gallery 의 모자이크 + 라이트박스.
+ *
+ *   - useGalleryLightbox 가 ESC / Arrow 키바인딩과 wrap-around 를 담당.
+ *   - useScrollReveal 로 fade-in (scrollReveal=true 일 때).
+ *   - lightbox open 시 body scroll lock (overflow:hidden).
+ *   - images 가 빈 배열이면 null 반환.
+ */
+declare function PublicGalleryMosaic(props: PublicGalleryMosaicProps): JSX.Element | null;
+
+export { PublicGalleryMosaic, type PublicGalleryMosaicProps };

package/dist/presets/ballet.js

@@ -0,0 +1,162 @@
+"use client";
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }
+
+var _chunkXLPMNJJVjs = require('../chunk-XLPMNJJV.js');
+
+
+
+var _chunkXSPWM4DDjs = require('../chunk-XSPWM4DD.js');
+
+// src/presets/ballet.tsx
+var _react = require('react');
+var _jsxruntime = require('react/jsx-runtime');
+var FALLBACK_I18N = {
+  sectionLabel: "\uAC24\uB7EC\uB9AC",
+  moments: "\uACF5\uC5F0\uC758 \uC21C\uAC04\uB4E4",
+  expandAria: "\uC774\uBBF8\uC9C0 \uD655\uB300",
+  lbClose: "\uB2EB\uAE30",
+  lbPrev: "\uC774\uC804 \uC774\uBBF8\uC9C0",
+  lbNext: "\uB2E4\uC74C \uC774\uBBF8\uC9C0"
+};
+function PublicGalleryMosaic(props) {
+  const {
+    images: rawImages,
+    count = 7,
+    i18n: i18nOverride,
+    className,
+    scrollReveal = true,
+    hideHeader = false
+  } = props;
+  const i18n = { ...FALLBACK_I18N, ..._nullishCoalesce(i18nOverride, () => ( {})) };
+  const images = rawImages.slice(0, count);
+  const lightbox = _chunkXSPWM4DDjs.useGalleryLightbox.call(void 0, images);
+  const { ref: revealRef, isVisible } = _chunkXSPWM4DDjs.useScrollReveal.call(void 0, { once: true });
+  _react.useEffect.call(void 0, () => {
+    if (!lightbox.isOpen) return;
+    if (typeof document === "undefined") return;
+    const prev = document.body.style.overflow;
+    document.body.style.overflow = "hidden";
+    return () => {
+      document.body.style.overflow = prev;
+    };
+  }, [lightbox.isOpen]);
+  if (images.length === 0) return null;
+  const showReveal = scrollReveal ? isVisible : true;
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "section",
+    {
+      ref: revealRef,
+      className: _chunkXLPMNJJVjs.cn.call(void 0, 
+        "gallery-public-mosaic-section",
+        showReveal && "gallery-public-mosaic-section--visible",
+        className
+      ),
+      "aria-label": i18n.sectionLabel,
+      children: [
+        !hideHeader && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "header", { className: "gallery-public-mosaic__head", children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "gallery-public-mosaic__label", children: i18n.sectionLabel }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h2", { className: "gallery-public-mosaic__title", children: i18n.moments })
+        ] }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "gallery-public-mosaic", "data-count": images.length, children: images.map((img, i) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+          "div",
+          {
+            className: "gallery-public-mosaic__item",
+            role: "button",
+            tabIndex: 0,
+            "aria-label": _nullishCoalesce(img.alt, () => ( i18n.expandAria)),
+            onClick: () => lightbox.open(i),
+            onKeyDown: (e) => {
+              if (e.key === "Enter" || e.key === " ") {
+                e.preventDefault();
+                lightbox.open(i);
+              }
+            },
+            children: [
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                "img",
+                {
+                  src: img.src,
+                  alt: _nullishCoalesce(img.alt, () => ( "")),
+                  className: "gallery-public-mosaic__img",
+                  loading: "lazy"
+                }
+              ),
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "gallery-public-mosaic__hover", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "gallery-public-mosaic__icon", "aria-hidden": "true", children: "+" }) })
+            ]
+          },
+          `${img.src}-${i}`
+        )) }),
+        lightbox.isOpen && lightbox.current && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+          "div",
+          {
+            className: "gallery-lightbox",
+            role: "dialog",
+            "aria-modal": "true",
+            "aria-label": i18n.moments,
+            onClick: lightbox.close,
+            children: [
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                "button",
+                {
+                  type: "button",
+                  className: "gallery-lightbox__close",
+                  "aria-label": i18n.lbClose,
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    lightbox.close();
+                  },
+                  children: "\xD7"
+                }
+              ),
+              images.length > 1 && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                  "button",
+                  {
+                    type: "button",
+                    className: "gallery-lightbox__nav gallery-lightbox__prev",
+                    "aria-label": i18n.lbPrev,
+                    onClick: (e) => {
+                      e.stopPropagation();
+                      lightbox.prev();
+                    },
+                    children: "\u2039"
+                  }
+                ),
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                  "button",
+                  {
+                    type: "button",
+                    className: "gallery-lightbox__nav gallery-lightbox__next",
+                    "aria-label": i18n.lbNext,
+                    onClick: (e) => {
+                      e.stopPropagation();
+                      lightbox.next();
+                    },
+                    children: "\u203A"
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "gallery-lightbox__content", onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                "img",
+                {
+                  src: lightbox.current.src,
+                  alt: _nullishCoalesce(lightbox.current.alt, () => ( "")),
+                  className: "gallery-lightbox__img"
+                }
+              ) }),
+              images.length > 1 && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "gallery-lightbox__counter", children: [
+                lightbox.currentIndex + 1,
+                " / ",
+                images.length
+              ] })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+
+
+exports.PublicGalleryMosaic = PublicGalleryMosaic;
+//# sourceMappingURL=ballet.js.map

package/dist/presets/ballet.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/Users/uni4love/project/workspace/211-withwiz/node-packages/withwiz-gallery/dist/presets/ballet.js","../../src/presets/ballet.tsx"],"names":[],"mappings":"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","file":"/Users/uni4love/project/workspace/211-withwiz/node-packages/withwiz-gallery/dist/presets/ballet.js","sourcesContent":[null,"/**\n * @withwiz/gallery/presets/ballet\n *\n * 발레용 reference public 컴포넌트. ballet 의\n *   `src/components/sections/Gallery.tsx`\n * 의 모자이크 + 라이트박스 결합을 host 독립으로 추출.\n *\n * 사용 예 (host RSC + client mount):\n *\n *   import { PublicGalleryMosaic } from \"@withwiz/gallery/presets/ballet\";\n *   import { getFeaturedGalleries } from \"@withwiz/gallery/server\";\n *   import \"@withwiz/gallery/components/gallery.css\";\n *\n *   export default async function HomePage() {\n *     const featured = await getFeaturedGalleries(config, 7);\n *     const images = featured.map((g) => ({ src: g.imageUrl, alt: g.caption ?? \"갤러리\" }));\n *     return <PublicGalleryMosaic images={images} count={7} />;\n *   }\n *\n * yeroom 등 다른 host 는 이 preset 을 fork 하거나 `useGalleryLightbox` hook 만\n * 가져다 직접 그릴 수 있다.\n *\n * Host-independence:\n *   - `next/image`, `next/navigation`, `useI18n`, `@withwiz/pms` 등 직접 의존 0\n *   - 이미지는 plain `<img>` 사용. host 가 next/image 로 그리고 싶다면 fork.\n *   - 모든 라벨은 props.i18n 으로만 (fallback 한글).\n */\n\nimport { useEffect, type JSX } from \"react\";\nimport { useGalleryLightbox, type LightboxImage } from \"../hooks/useGalleryLightbox\";\nimport { useScrollReveal } from \"../hooks/useScrollReveal\";\nimport { cn } from \"../utils/cn\";\n\nconst FALLBACK_I18N = {\n  sectionLabel: \"갤러리\",\n  moments: \"공연의 순간들\",\n  expandAria: \"이미지 확대\",\n  lbClose: \"닫기\",\n  lbPrev: \"이전 이미지\",\n  lbNext: \"다음 이미지\",\n} as const;\n\nexport interface PublicGalleryMosaicProps {\n  /** 표시할 이미지 목록 (host 가 loaders 등에서 받아온 src/alt 매핑) */\n  images: LightboxImage[];\n  /** 모자이크 그리드 칸 수 (default 7). images.length > count 이면 slice. */\n  count?: number;\n  /** UI 라벨 i18n override. 미주입 키는 한글 fallback. */\n  i18n?: Partial<Record<keyof typeof FALLBACK_I18N, string>>;\n  /** 외부 className 추가 */\n  className?: string;\n  /** 스크롤 reveal (IntersectionObserver) 사용 여부 (default true). false 면 즉시 visible. */\n  scrollReveal?: boolean;\n  /** 섹션 헤더 비노출 (default false). host 가 자체 헤더를 두는 경우 true. */\n  hideHeader?: boolean;\n}\n\n/**\n * 발레 home gallery 의 모자이크 + 라이트박스.\n *\n *   - useGalleryLightbox 가 ESC / Arrow 키바인딩과 wrap-around 를 담당.\n *   - useScrollReveal 로 fade-in (scrollReveal=true 일 때).\n *   - lightbox open 시 body scroll lock (overflow:hidden).\n *   - images 가 빈 배열이면 null 반환.\n */\nexport function PublicGalleryMosaic(props: PublicGalleryMosaicProps): JSX.Element | null {\n  const {\n    images: rawImages,\n    count = 7,\n    i18n: i18nOverride,\n    className,\n    scrollReveal = true,\n    hideHeader = false,\n  } = props;\n\n  const i18n = { ...FALLBACK_I18N, ...(i18nOverride ?? {}) };\n\n  // count 만큼 잘라 사용 (images.length > count 인 경우 super-fluous 제거)\n  const images = rawImages.slice(0, count);\n\n  const lightbox = useGalleryLightbox(images);\n  const { ref: revealRef, isVisible } = useScrollReveal({ once: true });\n\n  // body scroll lock — lightbox 가 열린 동안 host 페이지의 스크롤을 막는다.\n  // SSR safe: document 가 정의된 환경에서만 동작.\n  useEffect(() => {\n    if (!lightbox.isOpen) return;\n    if (typeof document === \"undefined\") return;\n    const prev = document.body.style.overflow;\n    document.body.style.overflow = \"hidden\";\n    return () => {\n      document.body.style.overflow = prev;\n    };\n  }, [lightbox.isOpen]);\n\n  if (images.length === 0) return null;\n\n  const showReveal = scrollReveal ? isVisible : true;\n\n  return (\n    <section\n      ref={revealRef}\n      className={cn(\n        \"gallery-public-mosaic-section\",\n        showReveal && \"gallery-public-mosaic-section--visible\",\n        className,\n      )}\n      aria-label={i18n.sectionLabel}\n    >\n      {!hideHeader && (\n        <header className=\"gallery-public-mosaic__head\">\n          <div className=\"gallery-public-mosaic__label\">{i18n.sectionLabel}</div>\n          <h2 className=\"gallery-public-mosaic__title\">{i18n.moments}</h2>\n        </header>\n      )}\n\n      <div className=\"gallery-public-mosaic\" data-count={images.length}>\n        {images.map((img, i) => (\n          <div\n            key={`${img.src}-${i}`}\n            className=\"gallery-public-mosaic__item\"\n            role=\"button\"\n            tabIndex={0}\n            aria-label={img.alt ?? i18n.expandAria}\n            onClick={() => lightbox.open(i)}\n            onKeyDown={(e) => {\n              if (e.key === \"Enter\" || e.key === \" \") {\n                e.preventDefault();\n                lightbox.open(i);\n              }\n            }}\n          >\n            <img\n              src={img.src}\n              alt={img.alt ?? \"\"}\n              className=\"gallery-public-mosaic__img\"\n              loading=\"lazy\"\n            />\n            <div className=\"gallery-public-mosaic__hover\">\n              <div className=\"gallery-public-mosaic__icon\" aria-hidden=\"true\">\n                +\n              </div>\n            </div>\n          </div>\n        ))}\n      </div>\n\n      {lightbox.isOpen && lightbox.current && (\n        <div\n          className=\"gallery-lightbox\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-label={i18n.moments}\n          onClick={lightbox.close}\n        >\n          <button\n            type=\"button\"\n            className=\"gallery-lightbox__close\"\n            aria-label={i18n.lbClose}\n            onClick={(e) => {\n              e.stopPropagation();\n              lightbox.close();\n            }}\n          >\n            ×\n          </button>\n\n          {images.length > 1 && (\n            <>\n              <button\n                type=\"button\"\n                className=\"gallery-lightbox__nav gallery-lightbox__prev\"\n                aria-label={i18n.lbPrev}\n                onClick={(e) => {\n                  e.stopPropagation();\n                  lightbox.prev();\n                }}\n              >\n                ‹\n              </button>\n              <button\n                type=\"button\"\n                className=\"gallery-lightbox__nav gallery-lightbox__next\"\n                aria-label={i18n.lbNext}\n                onClick={(e) => {\n                  e.stopPropagation();\n                  lightbox.next();\n                }}\n              >\n                ›\n              </button>\n            </>\n          )}\n\n          <div className=\"gallery-lightbox__content\" onClick={(e) => e.stopPropagation()}>\n            <img\n              src={lightbox.current.src}\n              alt={lightbox.current.alt ?? \"\"}\n              className=\"gallery-lightbox__img\"\n            />\n          </div>\n\n          {images.length > 1 && (\n            <div className=\"gallery-lightbox__counter\">\n              {lightbox.currentIndex + 1} / {images.length}\n            </div>\n          )}\n        </div>\n      )}\n    </section>\n  );\n}\n"]}