@jenesei-software/jenesei-kit-react 1.0.0

package/build/component.constants-D9wVZ3zy.cjs

@@ -0,0 +1,22 @@
+"use strict";const e=require("./jsx-runtime-BcGej2Kr.cjs"),i=require("framer-motion"),t=require("react"),s=require("./component-D1NPhRuV.cjs"),n=require("./component.styles-B1DIataj.cjs"),o=require("styled-components"),a=require("./component-BV_7tGiu.cjs"),l=require("./component-C52VCES6.cjs"),d=require("./context.constants-B29-_8v3.cjs"),r=require("./theme.global-D6XU05Et.cjs"),u=require("./component.styles-BfvB83xM.cjs"),c=o(i.motion.div)`
+  display: flex;
+  position: absolute;
+  height: 100%;
+  width: 100%;
+  touch-action: pan-y;
+  &:hover {
+    cursor: grab;
+  }
+
+  &:active {
+    cursor: grabbing;
+  }
+`,x=o(i.motion.div)`
+  width: 6px;
+  height: 6px;
+  background-color: ${e=>e.theme.palette.whiteStandard};
+  border-radius: 5px;
+  opacity: 0.8;
+  cursor: pointer;
+`,p={initial:e=>({x:e>0?"100%":"-100%",scale:1,opacity:0}),active:{x:0,scale:1,opacity:1},exit:e=>({x:e>0?"-100%":"100%",scale:1,opacity:.2})},g={duration:.3,ease:[.56,.03,.12,1.04]},m={initial:e=>({x:e>0?"100%":"-100%",scale:1,opacity:0}),active:{x:0,scale:1,opacity:1},exit:e=>({x:e>0?"-100%":"100%",scale:1,opacity:.2})},h={duration:.3,ease:[.56,.03,.12,1.04]},v=[{id:0,children:e.jsxRuntimeExports.jsx(a.Stack,{sx:{default:{justifyContent:"flex-start",padding:"5px",flexGrow:1}},children:e.jsxRuntimeExports.jsx(s.Button,{isHiddenBorder:!0,isDisabled:!0,genre:"realebail-white",size:"medium",sxTypography:{default:{weight:700}},children:"Los Angeles"})}),imageSrc:"https://drupal-prod.visitcalifornia.com/sites/default/files/styles/fluid_1920/public/2020-06/VC_PlacesToVisit_LosAngelesCounty_RF_1170794243.jpg.webp?itok=46pJYz8v"},{id:1,children:e.jsxRuntimeExports.jsx(a.Stack,{sx:{default:{justifyContent:"flex-start",padding:"5px",flexGrow:1}},children:e.jsxRuntimeExports.jsx(s.Button,{isHiddenBorder:!0,isDisabled:!0,genre:"realebail-white",size:"medium",sxTypography:{default:{weight:700}},children:"Los Angeles"})}),imageSrc:"https://images.unsplash.com/flagged/photo-1575555201693-7cd442b8023f?fm=jpg&q=60&w=3000&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8bG9zJTIwYW5nZWxlc3xlbnwwfHwwfHx8MA%3D%3D"},{id:2,children:e.jsxRuntimeExports.jsx(a.Stack,{sx:{default:{justifyContent:"flex-start",padding:"5px",flexGrow:1}},children:e.jsxRuntimeExports.jsx(s.Button,{isHiddenBorder:!0,isDisabled:!0,genre:"realebail-white",size:"medium",sxTypography:{default:{weight:700}},children:"Los Angeles"})}),imageSrc:"https://img.goodfon.com/original/2048x1319/8/29/ssha-kaliforniia-los-andzheles-los-angeles-doma-neboskreby-s.jpg"},{id:3,children:e.jsxRuntimeExports.jsx(a.Stack,{sx:{default:{justifyContent:"flex-start",padding:"5px",flexGrow:1}},children:e.jsxRuntimeExports.jsx(s.Button,{isHiddenBorder:!0,isDisabled:!0,genre:"realebail-white",size:"medium",sxTypography:{default:{weight:700}},children:"Los Angeles"})}),imageSrc:"https://images.pexels.com/photos/2231756/pexels-photo-2231756.jpeg?auto=compress&cs=tinysrgb&dpr=2&w=500"},{id:4,children:e.jsxRuntimeExports.jsx(a.Stack,{sx:{default:{justifyContent:"flex-start",padding:"5px",flexGrow:1}},children:e.jsxRuntimeExports.jsx(s.Button,{isHiddenBorder:!0,isDisabled:!0,genre:"realebail-white",size:"medium",sxTypography:{default:{weight:700}},children:"Los Angeles"})}),imageSrc:"https://images.pexels.com/photos/1813157/pexels-photo-1813157.jpeg?auto=compress&cs=tinysrgb&dpr=2&w=500"}];exports.IMAGES=v,exports.ImageSlider=o=>{var v,f,j,b;const{onIndexChange:I}=o,y=t.useMemo(()=>o.images,[o.images]),w=t.useMemo(()=>r.KEY_SIZE_DATA[o.size],[o.size]),E=t.useMemo(()=>`${w.radius}px`,[w.radius]),{isLengthZero:R,direction:k,activeImageId:S,isLengthOne:z,dragEndHandler:C,activeImageIndex:A,swipeToImage:B,skipToImage:H,handleAdd:T}=(o=>{var u;const{onIndexChange:m}=o,h=t.useMemo(()=>r.KEY_SIZE_DATA[o.size],[o.size]),v=t.useMemo(()=>`${h.radius}px`,[h.radius]),f=t.useMemo(()=>o.images,[o.images]),[{activeImageId:j,direction:b},I]=t.useState({activeImageId:(null==(u=null==f?void 0:f[0])?void 0:u.id)??null,direction:0}),y=t.useMemo(()=>1===(null==f?void 0:f.length),[f]),w=t.useMemo(()=>0===(null==f?void 0:f.length),[f]),E=t.useMemo(()=>f.findIndex(e=>e.id===j),[j,f]),R=t.useCallback(e=>{const i=(f.findIndex(e=>e.id===j)+e+f.length)%f.length;I({activeImageId:f[i].id,direction:e})},[j,f]),k=t.useCallback(e=>{const{offset:i,velocity:t}=e,s=Math.abs(i.x)*t.x;s>500||i.x>50?R(-1):(s<-500||i.x<-50)&&R(1)},[R]),S=t.useCallback(e=>{const i=f.findIndex(e=>e.id===j),t=f.findIndex(i=>i.id===e);-1!==t&&t!==i&&I({activeImageId:e,direction:t>i?1:-1})},[j,f]);t.useEffect(()=>{j&&(null==m||m(j))},[j,m]);const{add:z}=d.useDialog({br:v,dragEndHandler:k,images:f,children:o.children,activeImageIndex:E,activeImageId:j,swipeToImage:R,skipToImage:S,direction:b,genre:o.genre,size:o.size,propsDialog:{borderRadius:v,padding:"0",background:"whiteStandard"}}),C=t.useCallback(()=>{z({content:(t,d)=>{var r,u,m,h,v,f,j,b;return e.jsxRuntimeExports.jsxs(a.Stack,{sx:{default:{position:"relative",overflow:"hidden",aspectRatio:2*o.imageSettings.aspect+" / 2",width:"auto",maxWidth:"70dvw",height:"85dvh",borderRadius:null==t?void 0:t.br},tablet:{maxWidth:"95dvw"}},children:[e.jsxRuntimeExports.jsx(i.AnimatePresence,{initial:!1,custom:null==t?void 0:t.direction,children:e.jsxRuntimeExports.jsxs(c,{style:{overflow:"hidden",borderRadius:null==t?void 0:t.br},custom:null==t?void 0:t.direction,variants:p,initial:"initial",animate:"active",exit:"exit",transition:g,...y?{}:{drag:"x",dragConstraints:{left:0,right:0},dragElastic:.5,onDragEnd:(e,i)=>null==t?void 0:t.dragEndHandler(i)},children:[e.jsxRuntimeExports.jsx(n.Image,{sxStack:e=>({default:{width:"100%",height:"100%",alignItems:"center",justifyContent:"center",backgroundColor:e.palette.black10,position:"absolute",pointerEvents:"none"}}),isShowBeforeImage:!0,sxImage:{default:{objectFit:"contain"}},alt:null==(u=null==(r=(null==t?void 0:t.images)??[])?void 0:r[(null==t?void 0:t.activeImageIndex)??0])?void 0:u.imageSrc,src:null==(h=null==(m=(null==t?void 0:t.images)??[])?void 0:m[(null==t?void 0:t.activeImageIndex)??0])?void 0:h.imageSrc,componentFallback:e.jsxRuntimeExports.jsx(l.Typography,{sx:{default:{variant:"h6"}},children:o.locales.failedToLoad})}),null==(f=null==(v=(null==t?void 0:t.images)??[])?void 0:v[(null==t?void 0:t.activeImageIndex)??0])?void 0:f.children]},null==t?void 0:t.activeImageId)}),"function"==typeof(null==t?void 0:t.children)?null==(j=null==t?void 0:t.children)?void 0:j.call(t,{isDialog:!0}):null==t?void 0:t.children,e.jsxRuntimeExports.jsx(s.Button,{sx:{default:{position:"absolute",bottom:15,right:15}},genre:(null==t?void 0:t.genre)??"product",size:(null==t?void 0:t.size)??"medium",icons:[{type:"id",name:"Arrow4"}],isWidthAsHeight:!0,isHiddenBorder:!0,isRadius:!0,onClick:()=>null==d?void 0:d()}),y?null:e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs(a.Stack,{sx:{default:{position:"absolute",bottom:15,left:15,gap:"8px"}},children:[e.jsxRuntimeExports.jsx(s.Button,{genre:(null==t?void 0:t.genre)??"product",size:(null==t?void 0:t.size)??"medium",icons:[{type:"id",name:"Arrow4",turn:90}],isWidthAsHeight:!0,isHiddenBorder:!0,isPlaystationEffect:!0,isRadius:!0,onClick:()=>{var e;return null==(e=null==t?void 0:t.swipeToImage)?void 0:e.call(t,-1)}}),e.jsxRuntimeExports.jsx(s.Button,{genre:(null==t?void 0:t.genre)??"product",size:(null==t?void 0:t.size)??"medium",icons:[{type:"id",name:"Arrow4",turn:-90}],isWidthAsHeight:!0,isHiddenBorder:!0,isPlaystationEffect:!0,isRadius:!0,onClick:()=>{var e;return null==(e=null==t?void 0:t.swipeToImage)?void 0:e.call(t,1)}})]}),e.jsxRuntimeExports.jsx(a.Stack,{sx:{default:{position:"absolute",bottom:15,left:"50%",transform:"translateX(-50%)",gap:"4px"}},children:null==(b=(null==t?void 0:t.images)??[])?void 0:b.map(i=>e.jsxRuntimeExports.jsx(x,{onClick:()=>{var e;return null==(e=null==t?void 0:t.skipToImage)?void 0:e.call(t,i.id)},initial:!1,animate:{scale:(null==t?void 0:t.activeImageId)===i.id?1.5:1,opacity:(null==t?void 0:t.activeImageId)===i.id?1:.5}},i.id))})]})]})}})},[z,y,o.imageSettings.aspect,o.locales.failedToLoad]);return{isLengthZero:w,direction:b,activeImageId:j,isLengthOne:y,dragEndHandler:k,activeImageIndex:E,swipeToImage:R,skipToImage:S,handleAdd:C}})({genre:o.genre,size:o.size,images:y,imageSettings:o.imageSettings,locales:o.locales,onIndexChange:I,children:o.children});return e.jsxRuntimeExports.jsx(a.StackMotion,{...o.propsStack,sx:e=>{var i,t,s,n,a,l,d,r,u;return{...null==(i=o.propsStack)?void 0:i.sx,default:{borderRadius:E,flexDirection:"column",alignItems:"center",overflow:"hidden",width:"auto",maxWidth:"70dvw",height:"85dvh",...(null==(t=o.propsStack)?void 0:t.sx)?"function"==typeof(null==(s=o.propsStack)?void 0:s.sx)?null==(n=o.propsStack)?void 0:n.sx(e).default:null==(a=o.propsStack)?void 0:a.sx.default:{}},tablet:{maxWidth:"95dvw",...(null==(l=o.propsStack)?void 0:l.sx)?"function"==typeof(null==(d=o.propsStack)?void 0:d.sx)?null==(r=o.propsStack)?void 0:r.sx(e).tablet:null==(u=o.propsStack)?void 0:u.sx.tablet:{}}}},children:o.isLoading?e.jsxRuntimeExports.jsx(a.Stack,{sx:{default:{width:"100%",height:"100%",position:"relative",overflow:"hidden",display:"flex",alignItems:"center",justifyContent:"center"}},children:e.jsxRuntimeExports.jsx(u.Icon,{size:"large",type:"loading",primaryColor:"blueFocus",name:"Line"})}):R?e.jsxRuntimeExports.jsx(a.Stack,{sx:{default:{width:"100%",height:"100%",position:"relative",overflow:"hidden",display:"flex",alignItems:"center",justifyContent:"center"}},children:e.jsxRuntimeExports.jsx(l.Typography,{sx:{default:{variant:"h6"}},children:o.locales.noImagesAvailable})}):e.jsxRuntimeExports.jsxs(a.Stack,{sx:{default:{width:"100%",height:"100%",position:"relative",overflow:"hidden"}},children:[e.jsxRuntimeExports.jsx(i.AnimatePresence,{initial:!1,custom:k,children:e.jsxRuntimeExports.jsxs(c,{style:{overflow:"hidden",borderRadius:E},custom:k,variants:m,initial:"initial",animate:"active",exit:"exit",transition:h,...z?{}:{drag:"x",dragConstraints:{left:0,right:0},dragElastic:.5,onDragEnd:(e,i)=>C(i)},children:[e.jsxRuntimeExports.jsx(n.Image,{sxStack:e=>({default:{width:"100%",height:"100%",alignItems:"center",justifyContent:"center",backgroundColor:e.palette.black10,position:"absolute",pointerEvents:"none"}}),alt:null==(v=y[A])?void 0:v.imageSrc,src:null==(f=y[A])?void 0:f.imageSrc,componentFallback:e.jsxRuntimeExports.jsx(l.Typography,{sx:{default:{variant:"h6"}},children:o.locales.failedToLoad})}),null==(j=y[A])?void 0:j.children]},S)}),"function"==typeof(null==o?void 0:o.children)?null==(b=null==o?void 0:o.children)?void 0:b.call(o,{isDialog:!1}):null==o?void 0:o.children,!z&&e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(s.Button,{sx:{default:{position:"absolute",top:"50%",left:5,transform:"translateY(-50%)"}},genre:o.genre,size:o.size,icons:[{type:"id",name:"Arrow4",turn:90}],isWidthAsHeight:!0,isHiddenBorder:!0,isRadius:!0,onClick:()=>B(-1)}),e.jsxRuntimeExports.jsx(s.Button,{sx:{default:{position:"absolute",top:"50%",right:5,transform:"translateY(-50%)"}},genre:o.genre,size:o.size,icons:[{type:"id",name:"Arrow4",turn:-90}],isWidthAsHeight:!0,isHiddenBorder:!0,isRadius:!0,onClick:()=>B(1)}),e.jsxRuntimeExports.jsx(a.Stack,{sx:{default:{position:"absolute",bottom:5,left:"50%",transform:"translateX(-50%)",gap:"4px"}},children:y.map(i=>e.jsxRuntimeExports.jsx(x,{onClick:()=>H(i.id),initial:!1,animate:{scale:S===i.id?1.5:1,opacity:S===i.id?1:.5}},i.id))})]}),e.jsxRuntimeExports.jsx(s.Button,{sx:{default:{position:"absolute",bottom:5,right:5}},genre:o.genre,size:o.size,icons:[{type:"id",name:"Activity"}],isWidthAsHeight:!0,isHiddenBorder:!0,isRadius:!0,onClick:()=>T()})]})})},exports.SliderDot=x,exports.SliderImage=c;
+//# sourceMappingURL=component.constants-D9wVZ3zy.cjs.map

package/build/component.constants-D9wVZ3zy.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"component.constants-D9wVZ3zy.cjs","sources":["../src/components/image-slider/component.styles.tsx","../src/hooks/use-image-slider/use.tsx","../src/components/image-slider/component.tsx","../src/components/image-slider/component.constants.tsx"],"sourcesContent":["import { motion } from 'framer-motion'\nimport styled from 'styled-components'\n\nexport const SliderImage = styled(motion.div)`\n  display: flex;\n  position: absolute;\n  height: 100%;\n  width: 100%;\n  touch-action: pan-y;\n  &:hover {\n    cursor: grab;\n  }\n\n  &:active {\n    cursor: grabbing;\n  }\n`\n\nexport const SliderDot = styled(motion.div)`\n  width: 6px;\n  height: 6px;\n  background-color: ${props => props.theme.palette.whiteStandard};\n  border-radius: 5px;\n  opacity: 0.8;\n  cursor: pointer;\n`\n","import { AnimatePresence, PanInfo, Variants } from 'framer-motion'\nimport { useCallback, useEffect, useMemo, useState } from 'react'\n\nimport { Button } from '@local/components/button'\nimport { Image } from '@local/components/image'\nimport { ImageSliderProps, SliderDot, SliderImage } from '@local/components/image-slider'\nimport { Stack } from '@local/components/stack'\nimport { Typography } from '@local/components/typography'\nimport { useDialog } from '@local/contexts/context-dialog'\nimport { KEY_SIZE_DATA } from '@local/theme'\n\nimport { useImageSliderProps } from '.'\n\nexport const useImageSlider = (props: useImageSliderProps) => {\n  const { onIndexChange } = props\n\n  const size = useMemo(() => KEY_SIZE_DATA[props.size], [props.size])\n  const br = useMemo(() => `${size.radius}px`, [size.radius])\n\n  const images = useMemo(() => props.images, [props.images])\n\n  const [{ activeImageId, direction }, setActiveImage] = useState({\n    activeImageId: images?.[0]?.id ?? null,\n    direction: 0\n  })\n  const isLengthOne = useMemo(() => images?.length === 1, [images])\n  const isLengthZero = useMemo(() => images?.length === 0, [images])\n\n  const activeImageIndex = useMemo(() => images.findIndex(img => img.id === activeImageId), [activeImageId, images])\n\n  const swipeToImage = useCallback(\n    (swipeDirection: number) => {\n      const currentIndex = images.findIndex(img => img.id === activeImageId)\n      const nextIndex = (currentIndex + swipeDirection + images.length) % images.length\n      setActiveImage({ activeImageId: images[nextIndex].id, direction: swipeDirection })\n    },\n    [activeImageId, images]\n  )\n  const dragEndHandler = useCallback(\n    (dragInfo: PanInfo) => {\n      const { offset, velocity } = dragInfo\n      const swipeThreshold = 50\n      const swipePower = Math.abs(offset.x) * velocity.x\n\n      if (swipePower > 500 || offset.x > swipeThreshold) {\n        swipeToImage(-1)\n      } else if (swipePower < -500 || offset.x < -swipeThreshold) {\n        swipeToImage(1)\n      }\n    },\n    [swipeToImage]\n  )\n  const skipToImage = useCallback(\n    (imageId: number) => {\n      const currentIndex = images.findIndex(img => img.id === activeImageId)\n      const newIndex = images.findIndex(img => img.id === imageId)\n      if (newIndex === -1 || newIndex === currentIndex) return\n\n      const direction = newIndex > currentIndex ? 1 : -1\n      setActiveImage({ activeImageId: imageId, direction })\n    },\n    [activeImageId, images]\n  )\n\n  useEffect(() => {\n    if (activeImageId) onIndexChange?.(activeImageId)\n  }, [activeImageId, onIndexChange])\n\n  const { add } = useDialog<\n    {\n      br?: string\n      dragEndHandler: (dragInfo: PanInfo) => void\n      images: ImageSliderProps['images']\n      children?: ImageSliderProps['children']\n      activeImageIndex: number\n      activeImageId: number | null\n      swipeToImage: (swipeDirection: number) => void\n      skipToImage: (imageId: number) => void\n      direction: number\n    } & Pick<ImageSliderProps, 'genre' | 'size'>\n  >({\n    br: br,\n    dragEndHandler: dragEndHandler,\n    images: images,\n    children: props.children,\n    activeImageIndex: activeImageIndex,\n    activeImageId: activeImageId,\n    swipeToImage: swipeToImage,\n    skipToImage: skipToImage,\n    direction: direction,\n    genre: props.genre,\n    size: props.size,\n    propsDialog: {\n      borderRadius: br,\n      padding: '0',\n      background: 'whiteStandard'\n    }\n  })\n  const handleAdd = useCallback(() => {\n    add({\n      content: (params, remove) => (\n        <Stack\n          sx={{\n            default: {\n              position: 'relative',\n              overflow: 'hidden',\n              aspectRatio: `${props.imageSettings.aspect * 2} / 2`,\n              width: 'auto',\n              maxWidth: '70dvw',\n              height: '85dvh',\n              borderRadius: params?.br\n            },\n            tablet: {\n              maxWidth: '95dvw'\n            }\n          }}\n        >\n          <AnimatePresence initial={false} custom={params?.direction}>\n            <SliderImage\n              key={params?.activeImageId}\n              style={{\n                overflow: 'hidden',\n                borderRadius: params?.br\n              }}\n              custom={params?.direction}\n              variants={sliderVariants}\n              initial=\"initial\"\n              animate=\"active\"\n              exit=\"exit\"\n              transition={sliderTransition}\n              {...(!isLengthOne\n                ? {\n                    drag: 'x',\n                    dragConstraints: { left: 0, right: 0 },\n                    dragElastic: 0.5,\n                    onDragEnd: (_, dragInfo) => params?.dragEndHandler(dragInfo)\n                  }\n                : {})}\n            >\n              <Image\n                sxStack={theme => ({\n                  default: {\n                    width: '100%',\n                    height: '100%',\n                    alignItems: 'center',\n                    justifyContent: 'center',\n                    backgroundColor: theme.palette.black10,\n                    position: 'absolute',\n                    pointerEvents: 'none'\n                  }\n                })}\n                isShowBeforeImage\n                sxImage={{\n                  default: {\n                    objectFit: 'contain'\n                  }\n                }}\n                alt={(params?.images ?? [])?.[params?.activeImageIndex ?? 0]?.imageSrc}\n                src={(params?.images ?? [])?.[params?.activeImageIndex ?? 0]?.imageSrc}\n                componentFallback={\n                  <Typography\n                    sx={{\n                      default: {\n                        variant: 'h6'\n                      }\n                    }}\n                  >\n                    {props.locales.failedToLoad}\n                  </Typography>\n                }\n              />\n              {(params?.images ?? [])?.[params?.activeImageIndex ?? 0]?.children}\n            </SliderImage>\n          </AnimatePresence>\n          {typeof params?.children === 'function' ? params?.children?.({ isDialog: true }) : params?.children}\n\n          <Button\n            sx={{\n              default: {\n                position: 'absolute',\n                bottom: 15,\n                right: 15\n              }\n            }}\n            genre={params?.genre ?? 'product'}\n            size={params?.size ?? 'medium'}\n            icons={[\n              {\n                type: 'id',\n                name: 'Arrow4'\n              }\n            ]}\n            isWidthAsHeight\n            isHiddenBorder\n            isRadius\n            onClick={() => remove?.()}\n          />\n          {!isLengthOne ? (\n            <>\n              <Stack\n                sx={{\n                  default: {\n                    position: 'absolute',\n                    bottom: 15,\n                    left: 15,\n                    gap: '8px'\n                  }\n                }}\n              >\n                <Button\n                  genre={params?.genre ?? 'product'}\n                  size={params?.size ?? 'medium'}\n                  icons={[\n                    {\n                      type: 'id',\n                      name: 'Arrow4',\n                      turn: 90\n                    }\n                  ]}\n                  isWidthAsHeight\n                  isHiddenBorder\n                  isPlaystationEffect\n                  isRadius\n                  onClick={() => params?.swipeToImage?.(-1)}\n                />\n                <Button\n                  genre={params?.genre ?? 'product'}\n                  size={params?.size ?? 'medium'}\n                  icons={[\n                    {\n                      type: 'id',\n                      name: 'Arrow4',\n                      turn: -90\n                    }\n                  ]}\n                  isWidthAsHeight\n                  isHiddenBorder\n                  isPlaystationEffect\n                  isRadius\n                  onClick={() => params?.swipeToImage?.(1)}\n                />\n              </Stack>\n              <Stack\n                sx={{\n                  default: {\n                    position: 'absolute',\n                    bottom: 15,\n                    left: '50%',\n                    transform: 'translateX(-50%)',\n                    gap: '4px'\n                  }\n                }}\n              >\n                {(params?.images ?? [])?.map(i => (\n                  <SliderDot\n                    onClick={() => params?.skipToImage?.(i.id)}\n                    key={i.id}\n                    initial={false}\n                    animate={{\n                      scale: params?.activeImageId === i.id ? 1.5 : 1,\n                      opacity: params?.activeImageId === i.id ? 1 : 0.5\n                    }}\n                  />\n                ))}\n              </Stack>\n            </>\n          ) : null}\n        </Stack>\n      )\n    })\n  }, [add, isLengthOne, props.imageSettings.aspect, props.locales.failedToLoad])\n  return {\n    isLengthZero,\n    direction,\n    activeImageId,\n    isLengthOne,\n    dragEndHandler,\n    activeImageIndex,\n    swipeToImage,\n    skipToImage,\n    handleAdd\n  }\n}\nconst sliderVariants: Variants = {\n  initial: direction => ({\n    x: direction > 0 ? '100%' : '-100%',\n    scale: 1,\n    opacity: 0\n  }),\n  active: { x: 0, scale: 1, opacity: 1 },\n  exit: direction => ({\n    x: direction > 0 ? '-100%' : '100%',\n    scale: 1,\n    opacity: 0.2\n  })\n}\nconst sliderTransition = {\n  duration: 0.3,\n  ease: [0.56, 0.03, 0.12, 1.04]\n}\n","import { AnimatePresence, Variants } from 'framer-motion'\nimport { FC, useMemo } from 'react'\n\nimport { useImageSlider } from '@local/hooks/use-image-slider'\nimport { KEY_SIZE_DATA } from '@local/theme'\n\nimport { ImageSliderProps, SliderDot, SliderImage } from '.'\nimport { Button } from '../button'\nimport { Icon } from '../icon'\nimport { Image } from '../image'\nimport { Stack, StackMotion } from '../stack'\nimport { Typography } from '../typography'\n\nexport const ImageSlider: FC<ImageSliderProps> = props => {\n  const { onIndexChange } = props\n  const images = useMemo(() => props.images, [props.images])\n  const size = useMemo(() => KEY_SIZE_DATA[props.size], [props.size])\n  const br = useMemo(() => `${size.radius}px`, [size.radius])\n\n  const {\n    isLengthZero,\n    direction,\n    activeImageId,\n    isLengthOne,\n    dragEndHandler,\n    activeImageIndex,\n    swipeToImage,\n    skipToImage,\n    handleAdd\n  } = useImageSlider({\n    genre: props.genre,\n    size: props.size,\n    images: images,\n    imageSettings: props.imageSettings,\n    locales: props.locales,\n    onIndexChange: onIndexChange,\n    children: props.children\n  })\n  return (\n    <StackMotion\n      {...props.propsStack}\n      sx={theme => ({\n        ...props.propsStack?.sx,\n        default: {\n          borderRadius: br,\n          flexDirection: 'column',\n          alignItems: 'center',\n          overflow: 'hidden',\n          width: 'auto',\n          maxWidth: '70dvw',\n          height: '85dvh',\n          ...(props.propsStack?.sx\n            ? typeof props.propsStack?.sx === 'function'\n              ? props.propsStack?.sx(theme).default\n              : props.propsStack?.sx.default\n            : {})\n        },\n        tablet: {\n          maxWidth: '95dvw',\n          ...(props.propsStack?.sx\n            ? typeof props.propsStack?.sx === 'function'\n              ? props.propsStack?.sx(theme).tablet\n              : props.propsStack?.sx.tablet\n            : {})\n        }\n      })}\n    >\n      {props.isLoading ? (\n        <Stack\n          sx={{\n            default: {\n              width: '100%',\n              height: '100%',\n              position: 'relative',\n              overflow: 'hidden',\n              display: 'flex',\n              alignItems: 'center',\n              justifyContent: 'center'\n            }\n          }}\n        >\n          <Icon size=\"large\" type=\"loading\" primaryColor=\"blueFocus\" name=\"Line\" />\n        </Stack>\n      ) : !isLengthZero ? (\n        <Stack\n          sx={{\n            default: {\n              width: '100%',\n              height: '100%',\n              position: 'relative',\n              overflow: 'hidden'\n            }\n          }}\n        >\n          <AnimatePresence initial={false} custom={direction}>\n            <SliderImage\n              key={activeImageId}\n              style={{\n                overflow: 'hidden',\n                borderRadius: br\n              }}\n              custom={direction}\n              variants={sliderVariants}\n              initial=\"initial\"\n              animate=\"active\"\n              exit=\"exit\"\n              transition={sliderTransition}\n              {...(!isLengthOne\n                ? {\n                    drag: 'x',\n                    dragConstraints: { left: 0, right: 0 },\n                    dragElastic: 0.5,\n                    onDragEnd: (_, dragInfo) => dragEndHandler(dragInfo)\n                  }\n                : {})}\n            >\n              <Image\n                sxStack={theme => ({\n                  default: {\n                    width: '100%',\n                    height: '100%',\n                    alignItems: 'center',\n                    justifyContent: 'center',\n                    backgroundColor: theme.palette.black10,\n                    position: 'absolute',\n                    pointerEvents: 'none'\n                  }\n                })}\n                alt={images[activeImageIndex]?.imageSrc}\n                src={images[activeImageIndex]?.imageSrc}\n                componentFallback={\n                  <Typography\n                    sx={{\n                      default: {\n                        variant: 'h6'\n                      }\n                    }}\n                  >\n                    {props.locales.failedToLoad}\n                  </Typography>\n                }\n              />\n              {images[activeImageIndex]?.children}\n            </SliderImage>\n          </AnimatePresence>\n          {typeof props?.children === 'function' ? props?.children?.({ isDialog: false }) : props?.children}\n\n          {!isLengthOne && (\n            <>\n              <Button\n                sx={{\n                  default: {\n                    position: 'absolute',\n                    top: '50%',\n                    left: 5,\n                    transform: 'translateY(-50%)'\n                  }\n                }}\n                genre={props.genre}\n                size={props.size}\n                icons={[\n                  {\n                    type: 'id',\n                    name: 'Arrow4',\n                    turn: 90\n                  }\n                ]}\n                isWidthAsHeight\n                isHiddenBorder\n                isRadius\n                onClick={() => swipeToImage(-1)}\n              />\n              <Button\n                sx={{\n                  default: {\n                    position: 'absolute',\n                    top: '50%',\n                    right: 5,\n                    transform: 'translateY(-50%)'\n                  }\n                }}\n                genre={props.genre}\n                size={props.size}\n                icons={[\n                  {\n                    type: 'id',\n                    name: 'Arrow4',\n                    turn: -90\n                  }\n                ]}\n                isWidthAsHeight\n                isHiddenBorder\n                isRadius\n                onClick={() => swipeToImage(1)}\n              />\n              <Stack\n                sx={{\n                  default: {\n                    position: 'absolute',\n                    bottom: 5,\n                    left: '50%',\n                    transform: 'translateX(-50%)',\n                    gap: '4px'\n                  }\n                }}\n              >\n                {images.map(i => (\n                  <SliderDot\n                    onClick={() => skipToImage(i.id)}\n                    key={i.id}\n                    initial={false}\n                    animate={{\n                      scale: activeImageId === i.id ? 1.5 : 1,\n                      opacity: activeImageId === i.id ? 1 : 0.5\n                    }}\n                  />\n                ))}\n              </Stack>\n            </>\n          )}\n\n          <Button\n            sx={{\n              default: {\n                position: 'absolute',\n                bottom: 5,\n                right: 5\n              }\n            }}\n            genre={props.genre}\n            size={props.size}\n            icons={[\n              {\n                type: 'id',\n                name: 'Activity'\n              }\n            ]}\n            isWidthAsHeight\n            isHiddenBorder\n            isRadius\n            onClick={() => handleAdd()}\n          />\n        </Stack>\n      ) : (\n        <Stack\n          sx={{\n            default: {\n              width: '100%',\n              height: '100%',\n              position: 'relative',\n              overflow: 'hidden',\n              display: 'flex',\n              alignItems: 'center',\n              justifyContent: 'center'\n            }\n          }}\n        >\n          <Typography\n            sx={{\n              default: {\n                variant: 'h6'\n              }\n            }}\n          >\n            {props.locales.noImagesAvailable}\n          </Typography>\n        </Stack>\n      )}\n    </StackMotion>\n  )\n}\nconst sliderVariants: Variants = {\n  initial: direction => ({\n    x: direction > 0 ? '100%' : '-100%',\n    scale: 1,\n    opacity: 0\n  }),\n  active: { x: 0, scale: 1, opacity: 1 },\n  exit: direction => ({\n    x: direction > 0 ? '-100%' : '100%',\n    scale: 1,\n    opacity: 0.2\n  })\n}\nconst sliderTransition = {\n  duration: 0.3,\n  ease: [0.56, 0.03, 0.12, 1.04]\n}\n","import 'styled-components'\n\nimport { ImageSliderProps } from '.'\nimport { Button } from '../button'\nimport { Stack } from '../stack'\n\nexport const IMAGES: ImageSliderProps['images'] = [\n  {\n    id: 0,\n    children: (\n      <Stack\n        sx={{\n          default: {\n            justifyContent: 'flex-start',\n            padding: '5px',\n            flexGrow: 1\n          }\n        }}\n      >\n        <Button\n          isHiddenBorder\n          isDisabled\n          genre=\"realebail-white\"\n          size=\"medium\"\n          sxTypography={{ default: { weight: 700 } }}\n        >\n          Los Angeles\n        </Button>\n      </Stack>\n    ),\n    imageSrc:\n      'https://drupal-prod.visitcalifornia.com/sites/default/files/styles/fluid_1920/public/2020-06/VC_PlacesToVisit_LosAngelesCounty_RF_1170794243.jpg.webp?itok=46pJYz8v'\n  },\n  {\n    id: 1,\n    children: (\n      <Stack\n        sx={{\n          default: {\n            justifyContent: 'flex-start',\n            padding: '5px',\n            flexGrow: 1\n          }\n        }}\n      >\n        <Button\n          isHiddenBorder\n          isDisabled\n          genre=\"realebail-white\"\n          size=\"medium\"\n          sxTypography={{ default: { weight: 700 } }}\n        >\n          Los Angeles\n        </Button>\n      </Stack>\n    ),\n    imageSrc:\n      'https://images.unsplash.com/flagged/photo-1575555201693-7cd442b8023f?fm=jpg&q=60&w=3000&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8bG9zJTIwYW5nZWxlc3xlbnwwfHwwfHx8MA%3D%3D'\n  },\n  {\n    id: 2,\n    children: (\n      <Stack\n        sx={{\n          default: {\n            justifyContent: 'flex-start',\n            padding: '5px',\n            flexGrow: 1\n          }\n        }}\n      >\n        <Button\n          isHiddenBorder\n          isDisabled\n          genre=\"realebail-white\"\n          size=\"medium\"\n          sxTypography={{ default: { weight: 700 } }}\n        >\n          Los Angeles\n        </Button>\n      </Stack>\n    ),\n    imageSrc:\n      'https://img.goodfon.com/original/2048x1319/8/29/ssha-kaliforniia-los-andzheles-los-angeles-doma-neboskreby-s.jpg'\n  },\n  {\n    id: 3,\n    children: (\n      <Stack\n        sx={{\n          default: {\n            justifyContent: 'flex-start',\n            padding: '5px',\n            flexGrow: 1\n          }\n        }}\n      >\n        <Button\n          isHiddenBorder\n          isDisabled\n          genre=\"realebail-white\"\n          size=\"medium\"\n          sxTypography={{ default: { weight: 700 } }}\n        >\n          Los Angeles\n        </Button>\n      </Stack>\n    ),\n    imageSrc: 'https://images.pexels.com/photos/2231756/pexels-photo-2231756.jpeg?auto=compress&cs=tinysrgb&dpr=2&w=500'\n  },\n  {\n    id: 4,\n    children: (\n      <Stack\n        sx={{\n          default: {\n            justifyContent: 'flex-start',\n            padding: '5px',\n            flexGrow: 1\n          }\n        }}\n      >\n        <Button\n          isHiddenBorder\n          isDisabled\n          genre=\"realebail-white\"\n          size=\"medium\"\n          sxTypography={{ default: { weight: 700 } }}\n        >\n          Los Angeles\n        </Button>\n      </Stack>\n    ),\n    imageSrc: 'https://images.pexels.com/photos/1813157/pexels-photo-1813157.jpeg?auto=compress&cs=tinysrgb&dpr=2&w=500'\n  }\n]\n"],"names":["SliderImage","styled","motion","div","SliderDot","props","theme","palette","whiteStandard","sliderVariants","initial","direction","x","scale","opacity","active","exit","sliderTransition","duration","ease","IMAGES","id","children","jsx","Stack","sx","default","justifyContent","padding","flexGrow","Button","isHiddenBorder","isDisabled","genre","size","sxTypography","weight","imageSrc","onIndexChange","images","useMemo","KEY_SIZE_DATA","br","radius","isLengthZero","activeImageId","isLengthOne","dragEndHandler","activeImageIndex","swipeToImage","skipToImage","handleAdd","setActiveImage","useState","_a","length","findIndex","img","useCallback","swipeDirection","nextIndex","dragInfo","offset","velocity","swipePower","Math","abs","imageId","currentIndex","newIndex","useEffect","add","useDialog","propsDialog","borderRadius","background","content","params","remove","jsxs","position","overflow","aspectRatio","imageSettings","aspect","width","maxWidth","height","tablet","AnimatePresence","custom","style","variants","animate","transition","drag","dragConstraints","left","right","dragElastic","onDragEnd","_","Image","sxStack","alignItems","backgroundColor","black10","pointerEvents","isShowBeforeImage","sxImage","objectFit","alt","_b","src","_d","_c","componentFallback","Typography","variant","locales","failedToLoad","_f","_e","_g","call","isDialog","bottom","icons","type","name","isWidthAsHeight","isRadius","onClick","Fragment","gap","turn","isPlaystationEffect","transform","_h","map","i","useImageSlider","StackMotion","propsStack","flexDirection","_i","isLoading","display","Icon","primaryColor","noImagesAvailable","top"],"mappings":"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"}

package/build/component.constants-DRvp5Bez.js

@@ -0,0 +1,142 @@
+import { j as jsxRuntimeExports } from "./jsx-runtime-BrDlu8eK.js";
+import { AnimatePresence, motion } from "framer-motion";
+import { useMemo, useCallback } from "react";
+import { c as Button } from "./component-DZxbW_Jz.js";
+import { b as Stack } from "./component-jPZYT5iL.js";
+const Pagination = (props) => {
+  const isDisabledPrevious = useMemo(() => props.index == 0 && !props.isInfinity, [props.index, props.isInfinity]);
+  const isDisabledNext = useMemo(
+    () => props.index == props.length - 1 && !props.isInfinity,
+    [props.index, props.isInfinity, props.length]
+  );
+  const gap = useMemo(() => props.gap ?? DEFAULT_COMPONENT_PAGINATION_GAP, [props.gap]);
+  const lengthData = useMemo(() => props.lengthData ?? {}, [props.lengthData]);
+  const handlePrevious = useCallback(() => {
+    if (props.index == 0) {
+      if (props.isInfinity) {
+        props.changeIndex(props.length - 1);
+      }
+    } else {
+      props.changeIndex(props.index - 1);
+    }
+  }, [props]);
+  const handleNext = useCallback(() => {
+    if (props.index == props.length - 1) {
+      if (props.isInfinity) {
+        props.changeIndex(0);
+      }
+    } else {
+      props.changeIndex(props.index + 1);
+    }
+  }, [props]);
+  const visibleButtons = useMemo(() => {
+    const half = Math.floor(props.viewQuantity / 2);
+    const start = Math.max(0, Math.min(props.index - half, props.length - props.viewQuantity));
+    const end = Math.min(props.length, start + props.viewQuantity);
+    return Array.from({ length: end - start }, (_, i) => start + i);
+  }, [props.index, props.viewQuantity, props.length]);
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    Stack,
+    {
+      sx: (theme) => ({
+        ...props == null ? void 0 : props.sx,
+        default: {
+          height: "fit-content",
+          gap: `${gap}px`,
+          ...(props == null ? void 0 : props.sx) ? typeof (props == null ? void 0 : props.sx) === "function" ? props == null ? void 0 : props.sx(theme).default : props == null ? void 0 : props.sx.default : {}
+        }
+      }),
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          Button,
+          {
+            isDisabled: isDisabledPrevious,
+            isHidden: isDisabledPrevious,
+            onClick: handlePrevious,
+            ...props.buttonControl,
+            icons: [
+              {
+                type: "id",
+                name: "Arrow2",
+                order: -1,
+                turn: 90
+              }
+            ],
+            children: !props.buttonControl.isWidthAsHeight && props.locale.prev
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          Stack,
+          {
+            sx: {
+              default: {
+                width: "fit-content",
+                height: "fit-content",
+                display: "flex",
+                gap: `${gap}px`,
+                alignItems: "center",
+                justifyContent: "flex-start"
+              }
+            },
+            children: Array.from({ length: props.length }).map((_, i) => {
+              var _a, _b;
+              const isVisible = visibleButtons.includes(i);
+              return /* @__PURE__ */ jsxRuntimeExports.jsx(AnimatePresence, { mode: "popLayout", children: isVisible && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                motion.div,
+                {
+                  layout: true,
+                  initial: {
+                    opacity: 0,
+                    scale: 0.8
+                  },
+                  animate: {
+                    opacity: 1,
+                    scale: 1
+                  },
+                  exit: {
+                    opacity: 0,
+                    scale: 0.8
+                  },
+                  transition: { duration: 1, ease: "backOut" },
+                  children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                    Button,
+                    {
+                      isWidthAsHeight: true,
+                      ...i === props.index ? props.buttonCount.active : props.buttonCount.inactive,
+                      ...lengthData == null ? void 0 : lengthData[i],
+                      onClick: () => props.changeIndex(i),
+                      children: ((_b = (_a = lengthData == null ? void 0 : lengthData[i]) == null ? void 0 : _a.icons) == null ? void 0 : _b.length) ? null : i + 1
+                    }
+                  )
+                }
+              ) }, i);
+            })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          Button,
+          {
+            isDisabled: isDisabledNext,
+            isHidden: isDisabledNext,
+            onClick: handleNext,
+            ...props.buttonControl,
+            icons: [
+              {
+                type: "id",
+                name: "Arrow2",
+                turn: -90
+              }
+            ],
+            children: !props.buttonControl.isWidthAsHeight && props.locale.next
+          }
+        )
+      ]
+    }
+  );
+};
+const DEFAULT_COMPONENT_PAGINATION_GAP = 12;
+export {
+  DEFAULT_COMPONENT_PAGINATION_GAP as D,
+  Pagination as P
+};
+//# sourceMappingURL=component.constants-DRvp5Bez.js.map

package/build/component.constants-DRvp5Bez.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"component.constants-DRvp5Bez.js","sources":["../src/components/pagination/component.tsx","../src/components/pagination/component.constants.ts"],"sourcesContent":["import { AnimatePresence, motion } from 'framer-motion'\nimport { FC, useCallback, useMemo } from 'react'\n\nimport { Button } from '@local/components/button'\nimport { Stack } from '@local/components/stack'\n\nimport { DEFAULT_COMPONENT_PAGINATION_GAP, PaginationProps } from '.'\n\nexport const Pagination: FC<PaginationProps> = props => {\n  const isDisabledPrevious = useMemo(() => props.index == 0 && !props.isInfinity, [props.index, props.isInfinity])\n  const isDisabledNext = useMemo(\n    () => props.index == props.length - 1 && !props.isInfinity,\n    [props.index, props.isInfinity, props.length]\n  )\n\n  const gap = useMemo(() => props.gap ?? DEFAULT_COMPONENT_PAGINATION_GAP, [props.gap])\n  const lengthData = useMemo(() => props.lengthData ?? {}, [props.lengthData])\n  const handlePrevious = useCallback(() => {\n    if (props.index == 0) {\n      if (props.isInfinity) {\n        props.changeIndex(props.length - 1)\n      }\n    } else {\n      props.changeIndex(props.index - 1)\n    }\n  }, [props])\n\n  const handleNext = useCallback(() => {\n    if (props.index == props.length - 1) {\n      if (props.isInfinity) {\n        props.changeIndex(0)\n      }\n    } else {\n      props.changeIndex(props.index + 1)\n    }\n  }, [props])\n\n  const visibleButtons = useMemo(() => {\n    const half = Math.floor(props.viewQuantity / 2)\n    const start = Math.max(0, Math.min(props.index - half, props.length - props.viewQuantity))\n    const end = Math.min(props.length, start + props.viewQuantity)\n    return Array.from({ length: end - start }, (_, i) => start + i)\n  }, [props.index, props.viewQuantity, props.length])\n\n  return (\n    <Stack\n      sx={theme => ({\n        ...props?.sx,\n        default: {\n          height: 'fit-content',\n          gap: `${gap}px`,\n          ...(props?.sx ? (typeof props?.sx === 'function' ? props?.sx(theme).default : props?.sx.default) : {})\n        }\n      })}\n    >\n      <Button\n        isDisabled={isDisabledPrevious}\n        isHidden={isDisabledPrevious}\n        onClick={handlePrevious}\n        {...props.buttonControl}\n        icons={[\n          {\n            type: 'id',\n            name: 'Arrow2',\n            order: -1,\n            turn: 90\n          }\n        ]}\n      >\n        {!props.buttonControl.isWidthAsHeight && props.locale.prev}\n      </Button>\n\n      <Stack\n        sx={{\n          default: {\n            width: 'fit-content',\n            height: 'fit-content',\n            display: 'flex',\n            gap: `${gap}px`,\n            alignItems: 'center',\n            justifyContent: 'flex-start'\n          }\n        }}\n      >\n        {Array.from({ length: props.length }).map((_, i) => {\n          const isVisible = visibleButtons.includes(i)\n          return (\n            <AnimatePresence key={i} mode=\"popLayout\">\n              {isVisible && (\n                <motion.div\n                  layout\n                  initial={{\n                    opacity: 0,\n                    scale: 0.8\n                  }}\n                  animate={{\n                    opacity: 1,\n                    scale: 1\n                  }}\n                  exit={{\n                    opacity: 0,\n                    scale: 0.8\n                  }}\n                  transition={{ duration: 1, ease: 'backOut' }}\n                >\n                  <Button\n                    isWidthAsHeight\n                    {...(i === props.index ? props.buttonCount.active : props.buttonCount.inactive)}\n                    {...lengthData?.[i]}\n                    onClick={() => props.changeIndex(i)}\n                  >\n                    {lengthData?.[i]?.icons?.length ? null : i + 1}\n                  </Button>\n                </motion.div>\n              )}\n            </AnimatePresence>\n          )\n        })}\n      </Stack>\n\n      <Button\n        isDisabled={isDisabledNext}\n        isHidden={isDisabledNext}\n        onClick={handleNext}\n        {...props.buttonControl}\n        icons={[\n          {\n            type: 'id',\n            name: 'Arrow2',\n            turn: -90\n          }\n        ]}\n      >\n        {!props.buttonControl.isWidthAsHeight && props.locale.next}\n      </Button>\n    </Stack>\n  )\n}\n","export const DEFAULT_COMPONENT_PAGINATION_GAP = 12\n"],"names":["jsxs","jsx"],"mappings":"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"}