dgz-ui-shared/dist/components/gallery/index.cjs.js

Custom ui library using React.js, Shadcn/ui, TailwindCSS, Typescript, dgz-ui library

"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../../jsx-runtime-DUiatUiq.cjs"),a=require("react"),k=require("../../lodash-C5w_OPmE.cjs"),N=require("../../utils-B6fNqzRf-BNysSCt9.cjs"),w=require("../../_commonjsHelpers-DKOUU3wS.cjs"),g=require("../../createLucideIcon-BnAj0RnC.cjs");/**
 * @license lucide-react v0.511.0 - ISC
 *
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */const S=[["path",{d:"m15 18-6-6 6-6",key:"1wnfg3"}]],C=g.createLucideIcon("chevron-left",S);/**
 * @license lucide-react v0.511.0 - ISC
 *
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */const A=[["path",{d:"m9 18 6-6-6-6",key:"mthhwq"}]],_=g.createLucideIcon("chevron-right",A);/**
 * @license lucide-react v0.511.0 - ISC
 *
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */const F=[["path",{d:"M12 15V3",key:"m9g1x1"}],["path",{d:"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4",key:"ih7n3h"}],["path",{d:"m7 10 5 5 5-5",key:"brsn70"}]],T=g.createLucideIcon("download",F);/**
 * @license lucide-react v0.511.0 - ISC
 *
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */const q=[["path",{d:"M18 6 6 18",key:"1bl5f8"}],["path",{d:"m6 6 12 12",key:"d8bk6v"}]],O=g.createLucideIcon("x",q);var R={exports:{}},z=R.exports,L;function D(){return L||(L=1,function(l,v){(function(u,m){m()})(z,function(){function u(e,o){return typeof o>"u"?o={autoBom:!1}:typeof o!="object"&&(console.warn("Deprecated: Expected third argument to be a object"),o={autoBom:!o}),o.autoBom&&/^\s*(?:text\/\S*|application\/xml|\S*\/\S*\+xml)\s*;.*charset\s*=\s*utf-8/i.test(e.type)?new Blob(["\uFEFF",e],{type:e.type}):e}function m(e,o,d){var n=new XMLHttpRequest;n.open("GET",e),n.responseType="blob",n.onload=function(){p(n.response,o,d)},n.onerror=function(){console.error("could not download file")},n.send()}function h(e){var o=new XMLHttpRequest;o.open("HEAD",e,!1);try{o.send()}catch{}return 200<=o.status&&299>=o.status}function f(e){try{e.dispatchEvent(new MouseEvent("click"))}catch{var o=document.createEvent("MouseEvents");o.initMouseEvent("click",!0,!0,window,0,0,0,80,20,!1,!1,!1,!1,0,null),e.dispatchEvent(o)}}var t=typeof window=="object"&&window.window===window?window:typeof self=="object"&&self.self===self?self:typeof w.commonjsGlobal=="object"&&w.commonjsGlobal.global===w.commonjsGlobal?w.commonjsGlobal:void 0,j=t.navigator&&/Macintosh/.test(navigator.userAgent)&&/AppleWebKit/.test(navigator.userAgent)&&!/Safari/.test(navigator.userAgent),p=t.saveAs||(typeof window!="object"||window!==t?function(){}:"download"in HTMLAnchorElement.prototype&&!j?function(e,o,d){var n=t.URL||t.webkitURL,i=document.createElement("a");o=o||e.name||"download",i.download=o,i.rel="noopener",typeof e=="string"?(i.href=e,i.origin===location.origin?f(i):h(i.href)?m(e,o,d):f(i,i.target="_blank")):(i.href=n.createObjectURL(e),setTimeout(function(){n.revokeObjectURL(i.href)},4e4),setTimeout(function(){f(i)},0))}:"msSaveOrOpenBlob"in navigator?function(e,o,d){if(o=o||e.name||"download",typeof e!="string")navigator.msSaveOrOpenBlob(u(e,d),o);else if(h(e))m(e,o,d);else{var n=document.createElement("a");n.href=e,n.target="_blank",setTimeout(function(){f(n)})}}:function(e,o,d,n){if(n=n||open("","_blank"),n&&(n.document.title=n.document.body.innerText="downloading..."),typeof e=="string")return m(e,o,d);var i=e.type==="application/octet-stream",y=/constructor/i.test(t.HTMLElement)||t.safari,b=/CriOS\/[\d]+/.test(navigator.userAgent);if((b||i&&y||j)&&typeof FileReader<"u"){var x=new FileReader;x.onloadend=function(){var c=x.result;c=b?c:c.replace(/^data:[^;]*;/,"data:attachment/file;"),n?n.location.href=c:location=c,n=null},x.readAsDataURL(e)}else{var E=t.URL||t.webkitURL,r=E.createObjectURL(e);n?n.location=r:location.href=r,n=null,setTimeout(function(){E.revokeObjectURL(r)},4e4)}});t.saveAs=p.saveAs=p,l.exports=p})}(R)),R.exports}var U=D();const G=()=>[{icon:s.jsxRuntimeExports.jsx(T,{size:20}),onClick:l=>{U.saveAs(l.src,l.title)},label:"Download"}],I=a.memo(({src:l,alt:v,fallbackImage:u})=>{const[m,h]=a.useState(!1),f=()=>{h(!0)};return s.jsxRuntimeExports.jsx("img",{src:m&&u?u:l,alt:v,className:"max-h-full max-w-full object-contain",onError:f})}),B=a.memo(({image:l,index:v,onClick:u,fallbackImage:m})=>{const[h,f]=a.useState(!1),t=()=>{f(!0)};return s.jsxRuntimeExports.jsx("div",{className:"aspect-video cursor-pointer overflow-hidden rounded-lg bg-gray-200 transition-opacity hover:opacity-80",onClick:()=>u(v),children:s.jsxRuntimeExports.jsx("img",{src:h&&m?m:l.thumbnail||l.src,alt:l.alt||`Image ${v+1}`,className:"h-full w-full object-cover",onError:t})},l.id)}),H=({images:l,actionButtons:v=[],fallbackImage:u,className:m,hasInfo:h,...f})=>{const[t,j]=a.useState(null),[p,e]=a.useState(!1),o=a.useMemo(()=>G(),[]),d=a.useMemo(()=>[...o,...v],[o,v]),n=a.useCallback(r=>{j(r),e(!0)},[]),i=a.useCallback(()=>{e(!1),j(null)},[]),y=a.useCallback(()=>{t!==null&&t>0&&j(t-1)},[t]),b=a.useCallback(()=>{t!==null&&t<l.length-1&&j(t+1)},[t,l.length]);a.useEffect(()=>{const r=c=>{if(p)switch(c.key){case"Escape":i();break;case"ArrowLeft":c.preventDefault(),y();break;case"ArrowRight":c.preventDefault(),b();break}};return document.addEventListener("keydown",r),()=>document.removeEventListener("keydown",r)},[p,y,b,i]),a.useEffect(()=>(p?document.body.style.overflow="hidden":document.body.style.overflow="unset",()=>{document.body.style.overflow="unset"}),[p]);const x=a.useMemo(()=>t!==null?l[t]:null,[t,l]),E=a.useMemo(()=>!p||!x?null:s.jsxRuntimeExports.jsxs("div",{className:"bg-opacity-95 bg-bg fixed inset-0 z-50 flex flex-col items-center justify-center",children:[s.jsxRuntimeExports.jsxs("div",{className:"absolute top-0 flex w-full items-start justify-between p-3",children:[s.jsxRuntimeExports.jsx("div",{children:x.title&&s.jsxRuntimeExports.jsx("h2",{className:"text-body-lg-semi-bold",children:x.title})}),s.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-4 py-1",children:[d.map((r,c)=>s.jsxRuntimeExports.jsx("button",{onClick:()=>r.onClick(x),className:"cursor-pointer",title:r.label,children:r.icon},c)),s.jsxRuntimeExports.jsx("button",{onClick:i,className:"cursor-pointer",title:"Close (Esc)",children:s.jsxRuntimeExports.jsx(O,{size:20})})]})]}),k.lodashExports.isNumber(t)&&t>0&&s.jsxRuntimeExports.jsx("button",{onClick:y,className:"bg-opacity-50 hover:bg-opacity-70 bg-bg text-secondary absolute top-1/2 left-2 z-50 -translate-y-1/2 rounded-full p-3 transition-all",title:"Previous (←)",children:s.jsxRuntimeExports.jsx(C,{size:24})}),k.lodashExports.isNumber(t)&&t<l.length-1&&s.jsxRuntimeExports.jsx("button",{onClick:b,className:"bg-opacity-0 hover:bg-opacity-100 text-secondary bg-bg absolute top-1/2 right-2 z-50 -translate-y-1/2 rounded-full p-3 transition-all",title:"Next (→)",children:s.jsxRuntimeExports.jsx(_,{size:24})}),s.jsxRuntimeExports.jsx("div",{className:"flex max-h-full max-w-full items-center justify-center overflow-hidden p-8",children:s.jsxRuntimeExports.jsx(I,{src:x.src,alt:x.alt||`Image ${t}`,fallbackImage:u})}),s.jsxRuntimeExports.jsx("div",{className:"bg-bg absolute bottom-0 w-full",children:s.jsxRuntimeExports.jsx("div",{className:"flex gap-2 overflow-x-auto p-3",children:l.map((r,c)=>s.jsxRuntimeExports.jsx("div",{className:N.mo("hover:border-item-primary h-16 min-w-16 shrink-0 cursor-pointer rounded border-3 border-transparent transition-all",c==t&&"border-item-primary"),onClick:()=>j(c),children:s.jsxRuntimeExports.jsx("img",{src:r.thumbnail||r.src,alt:r.alt||`Thumbnail ${c+1}`,className:"size-full object-cover",onError:M=>{u&&(M.currentTarget.src=u)}})},r.id))})})]}),[p,u,x,d,i,t,y,l,b]);return s.jsxRuntimeExports.jsxs("div",{className:"w-full",children:[s.jsxRuntimeExports.jsx("div",{...f,className:N.mo("grid grid-cols-1 gap-4 lg:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-4",m),children:l.map((r,c)=>s.jsxRuntimeExports.jsxs("div",{className:"relative",children:[s.jsxRuntimeExports.jsx(B,{image:r,index:c,onClick:n,fallbackImage:u}),h&&r.title&&s.jsxRuntimeExports.jsx("div",{className:"bg-bg/70 absolute bottom-0 flex min-h-10 w-full items-center justify-center text-center",children:r.title})]},r.id))}),E]})},$=a.memo(H);exports.MyGallery=$;