@jenesei-software/jenesei-kit-react 1.3.9 → 1.3.11

package/build/{component-Bzw_uobM.js → component-DaXKDHnc.js}

@@ -1,24 +1,27 @@
 import { j as jsxRuntimeExports } from "./jsx-runtime-BrDlu8eK.js";
-import { b as ErrorMessage } from "./style-BQ653xOS.js";
+import { b as ErrorMessage } from "./style-uVTmdhsH.js";
 import { useCallback } from "react";
-import { S as StyledInputWrapper, j as InputPrefixChildren, h as StyledInputPattern, i as StyledInputNumeric, f as StyledInput, k as InputPostfixChildren } from "./component.styles-DYS_AJ9F.js";
+import { useTheme } from "styled-components";
+import { S as StyledInputWrapper, j as InputPrefixChildren, h as StyledInputPattern, i as StyledInputNumeric, f as StyledInput, k as InputPostfixChildren } from "./component.styles-BbwS_Ekx.js";
 const Input = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m;
   const handleOnChange = useCallback(
     (input) => {
-      var _a, _b;
+      var _a2, _b2;
       if (props.variety === "standard") {
         const value = typeof input === "string" ? input : input.value;
         const cleaned = props.isNoSpaces ? value.replace(/\s+/g, "") : value;
-        (_a = props.onChange) == null ? void 0 : _a.call(props, cleaned);
+        (_a2 = props.onChange) == null ? void 0 : _a2.call(props, cleaned);
       }
       if (props.variety === "pattern" || props.variety === "numeric") {
         if (typeof input !== "string") {
-          (_b = props.onChange) == null ? void 0 : _b.call(props, input);
+          (_b2 = props.onChange) == null ? void 0 : _b2.call(props, input);
         }
       }
     },
     [props]
   );
+  const theme = useTheme();
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs(
       StyledInputWrapper,
@@ -51,9 +54,18 @@ const Input = (props) => {
               $prefixChildren: props == null ? void 0 : props.prefixChildren,
               $genre: props.genre,
               $size: props.size,
+              $font: {
+                size: ((_a = props.font) == null ? void 0 : _a.size) ?? 16,
+                weight: ((_b = props.font) == null ? void 0 : _b.weight) ?? (props.isBold ? 500 : 400),
+                family: ((_c = props.font) == null ? void 0 : _c.family) ?? theme.font.family,
+                height: ((_d = props.font) == null ? void 0 : _d.height) ?? theme.font.lineHeight
+              },
               $isBold: props.isBold,
               $isDisabled: props.isDisabled,
+              $isDisabledOutline: props.isDisabled ?? props.isDisabledOutline,
+              $isOutlineBoxShadow: props.isOutlineBoxShadow,
               $isCenter: props.isCenter,
+              $isReadOnly: props.isReadOnly,
               disabled: props.isDisabled,
               readOnly: props.isReadOnly,
               required: props.isRequired,
@@ -84,8 +96,17 @@ const Input = (props) => {
               $prefixChildren: props == null ? void 0 : props.prefixChildren,
               $genre: props.genre,
               $size: props.size,
+              $font: {
+                size: ((_e = props.font) == null ? void 0 : _e.size) ?? 16,
+                weight: ((_f = props.font) == null ? void 0 : _f.weight) ?? (props.isBold ? 500 : 400),
+                family: ((_g = props.font) == null ? void 0 : _g.family) ?? "Roboto Mono",
+                height: ((_h = props.font) == null ? void 0 : _h.height) ?? theme.font.lineHeight
+              },
               $isBold: props.isBold,
               $isDisabled: props.isDisabled,
+              $isDisabledOutline: props.isDisabled ?? props.isDisabledOutline,
+              $isOutlineBoxShadow: props.isOutlineBoxShadow,
+              $isReadOnly: props.isReadOnly,
               $isCenter: props.isCenter,
               disabled: props.isDisabled,
               readOnly: props.isReadOnly,
@@ -121,8 +142,17 @@ const Input = (props) => {
               $prefixChildren: props == null ? void 0 : props.prefixChildren,
               $genre: props.genre,
               $size: props.size,
+              $font: {
+                size: ((_i = props.font) == null ? void 0 : _i.size) ?? 16,
+                weight: ((_j = props.font) == null ? void 0 : _j.weight) ?? (props.isBold ? 500 : 400),
+                family: ((_k = props.font) == null ? void 0 : _k.family) ?? theme.font.family,
+                height: ((_l = props.font) == null ? void 0 : _l.height) ?? theme.font.lineHeight
+              },
               $isBold: props.isBold,
               $isDisabled: props.isDisabled,
+              $isDisabledOutline: props.isDisabled ?? props.isDisabledOutline,
+              $isOutlineBoxShadow: props.isOutlineBoxShadow,
+              $isReadOnly: props.isReadOnly,
               $isCenter: props.isCenter,
               disabled: props.isDisabled,
               readOnly: props.isReadOnly,
@@ -161,7 +191,18 @@ const Input = (props) => {
         ]
       }
     ),
-    (props == null ? void 0 : props.error) ? /* @__PURE__ */ jsxRuntimeExports.jsx(ErrorMessage, { ...props.error, size: (props == null ? void 0 : props.error.size) ?? props.size }) : null
+    (props == null ? void 0 : props.error) ? /* @__PURE__ */ jsxRuntimeExports.jsx(
+      ErrorMessage,
+      {
+        ...props.error,
+        size: (props == null ? void 0 : props.error.size) ?? props.size,
+        font: {
+          size: 12,
+          weight: 400,
+          family: ((_m = props.font) == null ? void 0 : _m.family) ?? theme.font.family
+        }
+      }
+    ) : null
   ] });
 };
 function formatPhoneNumber(dialCode, international) {
@@ -204,4 +245,4 @@ export {
   Input as I,
   formatPhoneNumber as f
 };
-//# sourceMappingURL=component-Bzw_uobM.js.map
+//# sourceMappingURL=component-DaXKDHnc.js.map

package/build/component-DaXKDHnc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"component-DaXKDHnc.js","sources":["../src/components/input/component.tsx"],"sourcesContent":["import { ErrorMessage } from '@local/styles/error';\n\nimport { useCallback } from 'react';\nimport { NumberFormatValues } from 'react-number-format';\nimport { useTheme } from 'styled-components';\n\nimport {\n  InputPostfixChildren,\n  InputPrefixChildren,\n  InputProps,\n  StyledInput,\n  StyledInputNumeric,\n  StyledInputPattern,\n  StyledInputWrapper,\n} from '.';\n\nexport const Input = (props: InputProps) => {\n  const handleOnChange = useCallback(\n    (input: string | NumberFormatValues) => {\n      if (props.variety === 'standard') {\n        const value = typeof input === 'string' ? input : input.value;\n        const cleaned = props.isNoSpaces ? value.replace(/\\s+/g, '') : value;\n        props.onChange?.(cleaned);\n      }\n\n      if (props.variety === 'pattern' || props.variety === 'numeric') {\n        if (typeof input !== 'string') {\n          props.onChange?.(input);\n        }\n      }\n    },\n    [props],\n  );\n  const theme = useTheme();\n  return (\n    <>\n      <StyledInputWrapper\n        $isInputEffect={props.isInputEffect}\n        className={props.className}\n        $isDisabled={props.isDisabled}\n        $sx={props.sx}\n        $size={props.size}\n        $isWidthAsHeight={props.isWidthAsHeight}\n      >\n        {props.prefixChildren && (\n          <InputPrefixChildren\n            $left={props.prefixChildren.left}\n            $right={props.prefixChildren.right}\n            $isDisabled={props.isDisabled}\n            $width={props.prefixChildren.width}\n          >\n            {props.prefixChildren.children}\n          </InputPrefixChildren>\n        )}\n        {props.variety === 'pattern' ? (\n          <StyledInputPattern\n            $isNiceNumber={props.isNiceNumber}\n            $isInputEffect={props.isInputEffect}\n            $error={props?.error}\n            $isLoading={props.isLoading}\n            $postfixChildren={props?.postfixChildren}\n            $prefixChildren={props?.prefixChildren}\n            $genre={props.genre}\n            $size={props.size}\n            $font={{\n              size: props.font?.size ?? 16,\n              weight: props.font?.weight ?? (props.isBold ? 500 : 400),\n              family: props.font?.family ?? theme.font.family,\n              height: props.font?.height ?? theme.font.lineHeight,\n            }}\n            $isBold={props.isBold}\n            $isDisabled={props.isDisabled}\n            $isDisabledOutline={props.isDisabled ?? props.isDisabledOutline}\n            $isOutlineBoxShadow={props.isOutlineBoxShadow}\n            $isCenter={props.isCenter}\n            $isReadOnly={props.isReadOnly}\n            disabled={props.isDisabled}\n            readOnly={props.isReadOnly}\n            required={props.isRequired}\n            defaultValue={props.defaultValue === null ? '' : props.defaultValue}\n            value={props.value === null ? '' : props.value}\n            placeholder={props.placeholder}\n            onValueChange={(props) => handleOnChange(props)}\n            onBlur={props.onBlur}\n            onFocus={props.onFocus}\n            onPaste={props.onPaste}\n            name={props.name}\n            id={props.id}\n            onKeyDown={props.onKeyDown}\n            inputMode={props.inputMode}\n            maxLength={props.maxLength}\n            minLength={props.minLength}\n            tabIndex={props.tabIndex}\n            {...props.propsPattern}\n          />\n        ) : props.variety === 'numeric' ? (\n          <StyledInputNumeric\n            $isNiceNumber={props.isNiceNumber}\n            $isInputEffect={props.isInputEffect}\n            $error={props?.error}\n            $isLoading={props.isLoading}\n            $postfixChildren={props?.postfixChildren}\n            $prefixChildren={props?.prefixChildren}\n            $genre={props.genre}\n            $size={props.size}\n            $font={{\n              size: props.font?.size ?? 16,\n              weight: props.font?.weight ?? (props.isBold ? 500 : 400),\n              family: props.font?.family ?? 'Roboto Mono',\n              height: props.font?.height ?? theme.font.lineHeight,\n            }}\n            $isBold={props.isBold}\n            $isDisabled={props.isDisabled}\n            $isDisabledOutline={props.isDisabled ?? props.isDisabledOutline}\n            $isOutlineBoxShadow={props.isOutlineBoxShadow}\n            $isReadOnly={props.isReadOnly}\n            $isCenter={props.isCenter}\n            disabled={props.isDisabled}\n            readOnly={props.isReadOnly}\n            required={props.isRequired}\n            defaultValue={props.defaultValue === null ? '' : props.defaultValue}\n            value={props.value === null ? '' : props.value}\n            placeholder={props.placeholder}\n            onValueChange={(props) => handleOnChange(props)}\n            onBlur={props.onBlur}\n            onFocus={props.onFocus}\n            onPaste={props.onPaste}\n            name={props.name}\n            id={props.id}\n            onKeyDown={props.onKeyDown}\n            inputMode={props.inputMode}\n            maxLength={props.maxLength}\n            minLength={props.minLength}\n            tabIndex={props.tabIndex}\n            {...props.propsNumeric}\n          />\n        ) : (\n          <StyledInput\n            $isNiceNumber={props.isNiceNumber}\n            inputMode={props.inputMode}\n            maxLength={props.maxLength}\n            minLength={props.minLength}\n            ref={props.ref}\n            $error={props.error}\n            $isInputEffect={props.isInputEffect}\n            $isLoading={props.isLoading}\n            $postfixChildren={props?.postfixChildren}\n            $prefixChildren={props?.prefixChildren}\n            $genre={props.genre}\n            $size={props.size}\n            $font={{\n              size: props.font?.size ?? 16,\n              weight: props.font?.weight ?? (props.isBold ? 500 : 400),\n              family: props.font?.family ?? theme.font.family,\n              height: props.font?.height ?? theme.font.lineHeight,\n            }}\n            $isBold={props.isBold}\n            $isDisabled={props.isDisabled}\n            $isDisabledOutline={props.isDisabled ?? props.isDisabledOutline}\n            $isOutlineBoxShadow={props.isOutlineBoxShadow}\n            $isReadOnly={props.isReadOnly}\n            $isCenter={props.isCenter}\n            disabled={props.isDisabled}\n            readOnly={props.isReadOnly}\n            required={props.isRequired}\n            defaultValue={props.defaultValue === null ? '' : props.defaultValue}\n            value={props.value === null ? '' : props.value}\n            placeholder={props.placeholder}\n            type={props.type}\n            autoComplete={props.autoComplete}\n            onInput={(event) => {\n              const input = event.target as HTMLInputElement;\n              handleOnChange(input.value);\n            }}\n            onBlur={props.onBlur}\n            onFocus={props.onFocus}\n            onPaste={props.onPaste}\n            name={props.name}\n            id={props.id}\n            tabIndex={props.tabIndex}\n            onKeyDown={props.onKeyDown}\n            min={props.min}\n            max={props.max}\n            step={props.step}\n          />\n        )}\n\n        {props.postfixChildren && (\n          <InputPostfixChildren\n            $left={props.postfixChildren.left}\n            $right={props.postfixChildren.right}\n            $isDisabled={props.isDisabled}\n            $width={props.postfixChildren.width}\n          >\n            {props.postfixChildren.children}\n          </InputPostfixChildren>\n        )}\n      </StyledInputWrapper>\n      {props?.error ? (\n        <ErrorMessage\n          {...props.error}\n          size={props?.error.size ?? props.size}\n          font={{\n            size: 12,\n            weight: 400,\n            family: props.font?.family ?? theme.font.family,\n          }}\n        />\n      ) : null}\n    </>\n  );\n};\n\nexport function formatPhoneNumber(dialCode: string, international: string) {\n  function isDigit(char: string): boolean {\n    return /\\d/.test(char);\n  }\n\n  let formattedNumber = '';\n  let placeholderNumber = '';\n  let dialCodeIndex = 0;\n\n  if (dialCode.length === 0) {\n    return { format: '', placeholder: '' };\n  }\n\n  for (let i = 0; i < international.length; i++) {\n    const char = international.charAt(i);\n\n    if (char === dialCode.charAt(dialCodeIndex)) {\n      formattedNumber += char;\n      placeholderNumber += isDigit(char) ? '#' : char;\n      dialCodeIndex++;\n    } else {\n      if (isDigit(char)) {\n        formattedNumber += '#';\n        placeholderNumber += '-';\n      } else {\n        formattedNumber += char;\n        placeholderNumber += char;\n      }\n    }\n  }\n\n  while (dialCodeIndex < dialCode.length) {\n    formattedNumber += dialCode.charAt(dialCodeIndex);\n    placeholderNumber += dialCode.charAt(dialCodeIndex);\n    dialCodeIndex++;\n  }\n\n  return {\n    format: formattedNumber,\n    placeholder: placeholderNumber,\n  };\n}\n"],"names":["_a","_b","jsxs","Fragment","jsx","props"],"mappings":"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"}

package/build/component-DnJo66DS.cjs

@@ -0,0 +1,90 @@
+"use strict";const e=require("./jsx-runtime-BcGej2Kr.cjs"),i=require("./component.styles-BKnUDWqO.cjs"),s=require("./component.styles-Dpg-__rn.cjs"),t=require("./component-CLqcB5mM.cjs"),o=require("./theme.global-CcoD5bPP.cjs"),n=require("./floating-ui.react--v70Xky9.cjs"),r=require("react"),d=require("styled-components"),l=require("./component-BVnHSTJd.cjs"),u=require("./style-Df37KnoJ.cjs"),c=require("./style-fRZ6xrVp.cjs"),a=require("framer-motion"),$=d.css`
+  ${e=>d.css`
+    background: ${e.theme.colors.button[e.$genre].background.rest};
+    border-color: ${e.theme.colors.button[e.$genre].border.rest};
+    color: ${e.theme.colors.button[e.$genre].color.rest};
+    &:hover {
+      ${(!e.$isHidden||e.$isNotHoverEffect)&&d.css`
+        background: ${e.theme.colors.button[e.$genre].background.hover};
+        border-color: ${e.theme.colors.button[e.$genre].border.hover};
+        color: ${e.theme.colors.button[e.$genre].color.hover};
+      `}
+    }
+  `};
+`,p=d.css`
+  ${e=>e.$isHidden?d.css`
+          opacity: 0.5;
+          background: ${e.theme.colors.button[e.$genre].background.rest} !important;
+          color: ${e.theme.colors.button[e.$genre].color.rest} !important;
+        `:d.css`
+          opacity: 1;
+        `}
+`,h=d.css`
+  ${e=>e.$isHiddenBorder&&d.css`
+      border: 0px transparent !important;
+    `}
+`,m=d.css`
+  ${e=>e.$isRadius&&d.css`
+      border-radius: 100px;
+    `}
+`,x=d.css`
+  ${e=>e.$isPlaystationEffect&&d.css`
+      box-shadow: ${e.theme.effects.button};
+    `}
+`,g=d.div`
+  ${e=>e.$isIconGroup?d.css`
+          display: flex;
+          gap: ${o.KEY_SIZE_DATA[e.$size].padding-2}px;
+          align-items: center;
+          order: ${e.$iconGroupOrder||"initial"};
+        `:d.css`
+          display: contents;
+        `}
+`,y=d.css`
+  ${e=>b({...o.KEY_SIZE_DATA[e.$size],isFullSize:e.$isFullSize,isWidthAsHeight:e.$isWidthAsHeight,isMinWidthAsContent:e.$isMinWidthAsContent})};
+`,b=e=>d.css`
+  height: fit-content;
+  min-height: ${e.height}px;
+  max-height: fit-content;
+  padding: 2px ${e.padding}px;
+  border-radius: ${e.radius}px;
+  gap: ${e.padding-2}px;
+  ${()=>e.isFullSize&&d.css`
+      height: 100%;
+      width: 100%;
+      border-radius: 0px;
+    `};
+  ${e.isWidthAsHeight&&d.css`
+    width: ${e.height}px;
+    min-width: ${e.height}px;
+    padding: 0px;
+  `};
+  ${e.isMinWidthAsContent&&d.css`
+    min-width: max-content;
+  `};
+`,f=d.css`
+  border: 1px solid transparent;
+`,v=d.css`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+`,z=d(a.motion.button)`
+  cursor: pointer;
+  user-select: none;
+
+  ${f};
+  ${y};
+  ${$};
+  ${p};
+  ${h};
+  ${m};
+  ${x};
+  ${v};
+  ${s.addRippleDefault};
+  ${u.addTransition};
+  ${u.addFont};
+  ${u.addOutline};
+  ${l.addSXTypography};
+  ${c.addSX};
+`;exports.Button=s=>{var l,u,c,a;const $=d.useTheme(),p=r.useMemo(()=>{var t,o;return null==(o=null==(t=s.icons??[])?void 0:t.filter(e=>!e.isHidden))?void 0:o.map((t,o)=>"id"===(null==t?void 0:t.type)?e.jsxRuntimeExports.jsx(i.Icon,{name:null==t?void 0:t.name,type:"id",size:(null==t?void 0:t.size)??s.size,turn:t.turn,order:t.order},`${t.type}-${t.name}-${o}`):"logo"===(null==t?void 0:t.type)?e.jsxRuntimeExports.jsx(i.Icon,{name:null==t?void 0:t.name,type:"logo",size:(null==t?void 0:t.size)??s.size,turn:t.turn,order:t.order},`${t.type}-${t.name}-${o}`):"bustmarket"===(null==t?void 0:t.type)?e.jsxRuntimeExports.jsx(i.Icon,{name:null==t?void 0:t.name,type:"bustmarket",size:(null==t?void 0:t.size)??s.size,turn:t.turn,order:t.order},`${t.type}-${t.name}-${o}`):"checkbox"===(null==t?void 0:t.type)?e.jsxRuntimeExports.jsx(i.Icon,{name:null==t?void 0:t.name,type:"checkbox",size:(null==t?void 0:t.size)??s.size,turn:t.turn,order:t.order},`${t.type}-${t.name}-${o}`):"loading"===(null==t?void 0:t.type)?e.jsxRuntimeExports.jsx(i.Icon,{name:null==t?void 0:t.name,type:"loading",size:(null==t?void 0:t.size)??s.size,turn:t.turn,order:t.order},`${t.type}-${t.name}-${o}`):"realebail"===(null==t?void 0:t.type)?e.jsxRuntimeExports.jsx(i.Icon,{name:null==t?void 0:t.name,type:"realebail",size:(null==t?void 0:t.size)??s.size,turn:t.turn,order:t.order},`${t.type}-${t.name}-${o}`):null)},[s.icons,s.size]),h=r.useRef(null),m=n.useMergeRefs([h,s.ref]);return e.jsxRuntimeExports.jsxs(z,{$font:{size:(null==(l=s.font)?void 0:l.size)??o.KEY_SIZE_DATA[s.size].font,weight:(null==(u=s.font)?void 0:u.weight)??700,family:(null==(c=s.font)?void 0:c.family)??$.font.family,height:null==(a=s.font)?void 0:a.height},$isNotHoverEffect:s.isNotHoverEffect,whileTap:s.isWhileTapEffect?{scale:.9,transition:{duration:.01}}:{},id:s.id,tabIndex:s.tabIndex??0,$isFullSize:s.isFullSize,$genre:s.genre,$size:s.size,$isDisabled:s.isDisabled,$isDisabledOutline:s.isDisabled??s.isDisabledOutline,$isOutlineBoxShadow:s.isOutlineBoxShadow,$isReadOnly:s.isReadOnly,$isMinWidthAsContent:s.isMinWidthAsContent,$isWidthAsHeight:s.isWidthAsHeight,$isRadius:s.isRadius,$isHidden:s.isHidden,$isPlaystationEffect:s.isPlaystationEffect,$sxTypography:s.sxTypography,$isHiddenBorder:s.isHiddenBorder||s.isPlaystationEffect,disabled:s.isDisabled,type:s.type??"button",className:s.className,onClick:e=>{!s.isDisabled&&s.onClick&&s.onClick(e)},onFocus:s.onFocus,onMouseDown:s.onMouseDown,ref:m,$sx:s.sx,children:[e.jsxRuntimeExports.jsx(t.Ripple,{color:$.colors.checkbox[s.genre].color.rest,isDisabled:s.isDisabled??s.isDisabledRipple,isHidden:s.isHidden}),!s.isOnlyIcon&&e.jsxRuntimeExports.jsx("div",{style:{order:0,display:"contents"},children:s.children&&s.children}),e.jsxRuntimeExports.jsx(g,{$size:s.size,$isIconGroup:s.isIconGroup,$iconGroupOrder:"iconGroupOrder"in s?s.iconGroupOrder:void 0,children:p})]})},exports.ButtonSize=y,exports.ButtonSizeConstructor=b,exports.StyledButton=z,exports.StyledButtonIconsWrapper=g;
+//# sourceMappingURL=component-DnJo66DS.cjs.map

package/build/component-DnJo66DS.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"component-DnJo66DS.cjs","sources":["../src/components/button/component.styles.ts","../src/components/button/component.tsx"],"sourcesContent":["import { addRippleDefault } from '@local/components/ripple';\nimport { addSXTypography } from '@local/components/typography';\nimport { addFont, addOutline, addTransition } from '@local/styles/add';\nimport { addSX } from '@local/styles/sx';\nimport { IThemeSizePropertyDefault, KEY_SIZE_DATA } from '@local/theme';\n\nimport { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\n\nimport { StyledDollarButtonIconsWrapperProps, StyledDollarButtonProps } from '.';\n\n/****************************************** Genre *************************************************/\nconst ButtonGenre = css<StyledDollarButtonProps>`\n  ${(props) => css`\n    background: ${props.theme.colors.button[props.$genre].background.rest};\n    border-color: ${props.theme.colors.button[props.$genre].border.rest};\n    color: ${props.theme.colors.button[props.$genre].color.rest};\n    &:hover {\n      ${\n        (!props.$isHidden || props.$isNotHoverEffect) &&\n        css`\n        background: ${props.theme.colors.button[props.$genre].background.hover};\n        border-color: ${props.theme.colors.button[props.$genre].border.hover};\n        color: ${props.theme.colors.button[props.$genre].color.hover};\n      `\n      }\n    }\n  `};\n`;\n\n/****************************************** Disabled *************************************************/\nconst ButtonDisabled = css<StyledDollarButtonProps>`\n  ${(props) =>\n    props.$isHidden\n      ? css`\n          opacity: 0.5;\n          background: ${props.theme.colors.button[props.$genre].background.rest} !important;\n          color: ${props.theme.colors.button[props.$genre].color.rest} !important;\n        `\n      : css`\n          opacity: 1;\n        `}\n`;\n/****************************************** is HiddenBorder *************************************************/\nconst ButtonIsHiddenBorder = css<StyledDollarButtonProps>`\n  ${(props) =>\n    props.$isHiddenBorder &&\n    css`\n      border: 0px transparent !important;\n    `}\n`;\n/****************************************** is Radius *************************************************/\nconst ButtonIsRadius = css<StyledDollarButtonProps>`\n  ${(props) =>\n    props.$isRadius &&\n    css`\n      border-radius: 100px;\n    `}\n`;\n/****************************************** is PlaystationEffect *************************************************/\nconst ButtonIsPlaystationEffect = css<StyledDollarButtonProps>`\n  ${(props) =>\n    props.$isPlaystationEffect &&\n    css`\n      box-shadow: ${props.theme.effects.button};\n    `}\n`;\n/****************************************** Icons Wrapper *************************************************/\nexport const StyledButtonIconsWrapper = styled.div<StyledDollarButtonIconsWrapperProps>`\n  ${(props) =>\n    props.$isIconGroup\n      ? css`\n          display: flex;\n          gap: ${KEY_SIZE_DATA[props.$size].padding - 2}px;\n          align-items: center;\n          order: ${props.$iconGroupOrder || 'initial'};\n        `\n      : css`\n          display: contents;\n        `}\n`;\n\n/****************************************** Size *************************************************/\nexport const ButtonSize = css<StyledDollarButtonProps>`\n  ${(props) =>\n    ButtonSizeConstructor({\n      ...KEY_SIZE_DATA[props.$size],\n      isFullSize: props.$isFullSize,\n      isWidthAsHeight: props.$isWidthAsHeight,\n      isMinWidthAsContent: props.$isMinWidthAsContent,\n    })};\n`;\nexport const ButtonSizeConstructor = (\n  props: IThemeSizePropertyDefault & {\n    isFullSize?: boolean;\n    isWidthAsHeight?: boolean;\n    isMinWidthAsContent?: boolean;\n  },\n) => css`\n  height: fit-content;\n  min-height: ${props.height}px;\n  max-height: fit-content;\n  padding: 2px ${props.padding}px;\n  border-radius: ${props.radius}px;\n  gap: ${props.padding - 2}px;\n  ${() =>\n    props.isFullSize &&\n    css`\n      height: 100%;\n      width: 100%;\n      border-radius: 0px;\n    `};\n  ${\n    props.isWidthAsHeight &&\n    css`\n    width: ${props.height}px;\n    min-width: ${props.height}px;\n    padding: 0px;\n  `\n  };\n  ${\n    props.isMinWidthAsContent &&\n    css`\n    min-width: max-content;\n  `\n  };\n`;\n/****************************************** Border *************************************************/\nconst ButtonBorder = css`\n  border: 1px solid transparent;\n`;\n\n/****************************************** Flex *************************************************/\nconst ButtonFlex = css<StyledDollarButtonProps>`\n  display: flex;\n  align-items: center;\n  justify-content: center;\n`;\n/****************************************** Styled *************************************************/\nexport const StyledButton = styled(motion.button)<StyledDollarButtonProps>`\n  cursor: pointer;\n  user-select: none;\n\n  ${ButtonBorder};\n  ${ButtonSize};\n  ${ButtonGenre};\n  ${ButtonDisabled};\n  ${ButtonIsHiddenBorder};\n  ${ButtonIsRadius};\n  ${ButtonIsPlaystationEffect};\n  ${ButtonFlex};\n  ${addRippleDefault};\n  ${addTransition};\n  ${addFont};\n  ${addOutline};\n  ${addSXTypography};\n  ${addSX};\n`;\n","import {\n  Icon,\n  TIconBustMarketNameString,\n  TIconCheckboxNameString,\n  TIconIdNameString,\n  TIconLoadingNameString,\n  TIconLogoNameString,\n  TIconRealEbailNameString,\n} from '@local/components/icon';\nimport { Ripple } from '@local/components/ripple';\nimport { KEY_SIZE_DATA } from '@local/theme';\n\nimport { useMergeRefs } from '@floating-ui/react';\nimport { FC, Ref, useMemo, useRef } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport { ButtonProps, StyledButton, StyledButtonIconsWrapper } from '.';\n\nexport const Button: FC<ButtonProps> = (props) => {\n  const theme = useTheme();\n\n  const iconComponents = useMemo(\n    () =>\n      (props.icons ?? [])\n        ?.filter((icon) => !icon.isHidden)\n        ?.map((icon, index) =>\n          icon?.type === 'id' ? (\n            <Icon\n              key={`${icon.type}-${icon.name}-${index}`}\n              name={icon?.name as TIconIdNameString}\n              type='id'\n              size={icon?.size ?? props.size}\n              turn={icon.turn}\n              order={icon.order}\n            />\n          ) : icon?.type === 'logo' ? (\n            <Icon\n              key={`${icon.type}-${icon.name}-${index}`}\n              name={icon?.name as TIconLogoNameString}\n              type='logo'\n              size={icon?.size ?? props.size}\n              turn={icon.turn}\n              order={icon.order}\n            />\n          ) : icon?.type === 'bustmarket' ? (\n            <Icon\n              key={`${icon.type}-${icon.name}-${index}`}\n              name={icon?.name as TIconBustMarketNameString}\n              type='bustmarket'\n              size={icon?.size ?? props.size}\n              turn={icon.turn}\n              order={icon.order}\n            />\n          ) : icon?.type === 'checkbox' ? (\n            <Icon\n              key={`${icon.type}-${icon.name}-${index}`}\n              name={icon?.name as TIconCheckboxNameString}\n              type='checkbox'\n              size={icon?.size ?? props.size}\n              turn={icon.turn}\n              order={icon.order}\n            />\n          ) : icon?.type === 'loading' ? (\n            <Icon\n              key={`${icon.type}-${icon.name}-${index}`}\n              name={icon?.name as TIconLoadingNameString}\n              type='loading'\n              size={icon?.size ?? props.size}\n              turn={icon.turn}\n              order={icon.order}\n            />\n          ) : icon?.type === 'realebail' ? (\n            <Icon\n              key={`${icon.type}-${icon.name}-${index}`}\n              name={icon?.name as TIconRealEbailNameString}\n              type='realebail'\n              size={icon?.size ?? props.size}\n              turn={icon.turn}\n              order={icon.order}\n            />\n          ) : null,\n        ),\n    [props.icons, props.size],\n  );\n\n  const handleClick: ButtonProps['onClick'] = (event) => {\n    if (!props.isDisabled && props.onClick) {\n      props.onClick(event);\n    }\n  };\n  const refDefault = useRef<HTMLButtonElement>(null);\n\n  const ref = useMergeRefs([refDefault, props.ref]);\n\n  return (\n    <StyledButton\n      $font={{\n        size: props.font?.size ?? KEY_SIZE_DATA[props.size].font,\n        weight: props.font?.weight ?? 700,\n        family: props.font?.family ?? theme.font.family,\n        height: props.font?.height,\n      }}\n      $isNotHoverEffect={props.isNotHoverEffect}\n      whileTap={props.isWhileTapEffect ? { scale: 0.9, transition: { duration: 0.01 } } : {}}\n      id={props.id}\n      tabIndex={props.tabIndex ?? 0}\n      $isFullSize={props.isFullSize}\n      $genre={props.genre}\n      $size={props.size}\n      $isDisabled={props.isDisabled}\n      $isDisabledOutline={props.isDisabled ?? props.isDisabledOutline}\n      $isOutlineBoxShadow={props.isOutlineBoxShadow}\n      $isReadOnly={props.isReadOnly}\n      $isMinWidthAsContent={props.isMinWidthAsContent}\n      $isWidthAsHeight={props.isWidthAsHeight}\n      $isRadius={props.isRadius}\n      $isHidden={props.isHidden}\n      $isPlaystationEffect={props.isPlaystationEffect}\n      $sxTypography={props.sxTypography}\n      $isHiddenBorder={props.isHiddenBorder || props.isPlaystationEffect}\n      disabled={props.isDisabled}\n      type={props.type ?? 'button'}\n      className={props.className}\n      onClick={handleClick}\n      onFocus={props.onFocus}\n      onMouseDown={props.onMouseDown}\n      ref={ref as Ref<HTMLButtonElement>}\n      $sx={props.sx}\n    >\n      <Ripple\n        color={theme.colors.checkbox[props.genre].color.rest}\n        isDisabled={props.isDisabled ?? props.isDisabledRipple}\n        isHidden={props.isHidden}\n      />\n\n      {!props.isOnlyIcon && <div style={{ order: 0, display: 'contents' }}>{props.children && props.children}</div>}\n      <StyledButtonIconsWrapper\n        $size={props.size}\n        $isIconGroup={props.isIconGroup}\n        $iconGroupOrder={'iconGroupOrder' in props ? props.iconGroupOrder : undefined}\n      >\n        {iconComponents}\n      </StyledButtonIconsWrapper>\n    </StyledButton>\n  );\n};\n"],"names":["ButtonGenre","css","props","theme","colors","button","$genre","background","rest","border","color","$isHidden","$isNotHoverEffect","hover","ButtonDisabled","ButtonIsHiddenBorder","$isHiddenBorder","ButtonIsRadius","$isRadius","ButtonIsPlaystationEffect","$isPlaystationEffect","effects","StyledButtonIconsWrapper","styled","div","$isIconGroup","KEY_SIZE_DATA","$size","padding","$iconGroupOrder","ButtonSize","ButtonSizeConstructor","isFullSize","$isFullSize","isWidthAsHeight","$isWidthAsHeight","isMinWidthAsContent","$isMinWidthAsContent","height","radius","ButtonBorder","ButtonFlex","StyledButton","motion","addRippleDefault","addTransition","addFont","addOutline","addSXTypography","addSX","useTheme","iconComponents","useMemo","_b","_a","icons","filter","icon","isHidden","map","index","type","jsx","Icon","name","size","turn","order","refDefault","useRef","ref","useMergeRefs","jsxs","$font","font","weight","family","_c","_d","isNotHoverEffect","whileTap","isWhileTapEffect","scale","transition","duration","id","tabIndex","genre","$isDisabled","isDisabled","$isDisabledOutline","isDisabledOutline","$isOutlineBoxShadow","isOutlineBoxShadow","$isReadOnly","isReadOnly","isRadius","isPlaystationEffect","$sxTypography","sxTypography","isHiddenBorder","disabled","className","onClick","event","onFocus","onMouseDown","$sx","sx","children","Ripple","checkbox","isDisabledRipple","isOnlyIcon","style","display","isIconGroup","iconGroupOrder"],"mappings":"ycAYMA,EAAcC,EAAAA,GAAAA;IACfC,GAAUD,EAAAA,GAAAA;kBACGC,EAAMC,MAAMC,OAAOC,OAAOH,EAAMI,QAAQC,WAAWC;oBACjDN,EAAMC,MAAMC,OAAOC,OAAOH,EAAMI,QAAQG,OAAOD;aACtDN,EAAMC,MAAMC,OAAOC,OAAOH,EAAMI,QAAQI,MAAMF;;UAGjDN,EAAMS,WAAaT,EAAMU,oBAC3BX,EAAAA,GAAAA;sBACcC,EAAMC,MAAMC,OAAOC,OAAOH,EAAMI,QAAQC,WAAWM;wBACjDX,EAAMC,MAAMC,OAAOC,OAAOH,EAAMI,QAAQG,OAAOI;iBACtDX,EAAMC,MAAMC,OAAOC,OAAOH,EAAMI,QAAQI,MAAMG;;;;EAQzDC,EAAiBb,EAAAA,GAAAA;IAClBC,GACDA,EAAMS,UACFV,EAAAA,GAAAA;;wBAEgBC,EAAMC,MAAMC,OAAOC,OAAOH,EAAMI,QAAQC,WAAWC;mBACxDN,EAAMC,MAAMC,OAAOC,OAAOH,EAAMI,QAAQI,MAAMF;UAEzDP,EAAAA,GAAAA;;;EAKFc,EAAuBd,EAAAA,GAAAA;IACxBC,GACDA,EAAMc,iBACNf,EAAAA,GAAAA;;;EAKEgB,EAAiBhB,EAAAA,GAAAA;IAClBC,GACDA,EAAMgB,WACNjB,EAAAA,GAAAA;;;EAKEkB,EAA4BlB,EAAAA,GAAAA;IAC7BC,GACDA,EAAMkB,sBACNnB,EAAAA,GAAAA;oBACgBC,EAAMC,MAAMkB,QAAQhB;;EAI3BiB,EAA2BC,EAAOC,GAAA;IAC1CtB,GACDA,EAAMuB,aACFxB,EAAAA,GAAAA;;iBAESyB,EAAAA,cAAcxB,EAAMyB,OAAOC,QAAU;;mBAEnC1B,EAAM2B,iBAAmB;UAEpC5B,EAAAA,GAAAA;;;EAMK6B,EAAa7B,EAAAA,GAAAA;IACrBC,GACD6B,EAAsB,IACjBL,EAAAA,cAAcxB,EAAMyB,OACvBK,WAAY9B,EAAM+B,YAClBC,gBAAiBhC,EAAMiC,iBACvBC,oBAAqBlC,EAAMmC;EAGpBN,EACX7B,GAKGD,EAAAA,GAAAA;;gBAEWC,EAAMoC;;iBAELpC,EAAM0B;mBACJ1B,EAAMqC;SAChBrC,EAAM0B,QAAU;IACrB,IACA1B,EAAM8B,YACN/B,EAAAA,GAAAA;;;;;IAMAC,EAAMgC,iBACNjC,EAAAA,GAAAA;aACSC,EAAMoC;iBACFpC,EAAMoC;;;IAKnBpC,EAAMkC,qBACNnC,EAAAA,GAAAA;;;EAMEuC,EAAevC,EAAAA,GAAAA;;EAKfwC,EAAaxC,EAAAA,GAAAA;;;;EAMNyC,EAAenB,EAAOoB,EAAAA,OAAOtC,OAAM;;;;IAI5CmC;IACAV;IACA9B;IACAc;IACAC;IACAE;IACAE;IACAsB;IACAG;IACAC;IACAC;IACAC;IACAC;IACAC;iBC1IoC/C,gBACtC,MAAMC,EAAQ+C,EAAAA,WAERC,EAAiBC,EAAAA,QACrB,aACG,OAAA,OAAAC,EAAA,OAAAC,EAAApD,EAAMqD,OAAS,SAAf,EAAAD,EACGE,OAAQC,IAAUA,EAAKC,kBAD1BL,EAEGM,IAAI,CAACF,EAAMG,IACI,cAAfH,WAAMI,QACJC,kBAAAA,IAACC,EAAAA,KAAA,CAECC,KAAM,MAAAP,OAAA,EAAAA,EAAMO,KACZH,KAAK,KACLI,MAAM,MAAAR,OAAA,EAAAA,EAAMQ,OAAQ/D,EAAM+D,KAC1BC,KAAMT,EAAKS,KACXC,MAAOV,EAAKU,OALP,GAAGV,EAAKI,QAAQJ,EAAKO,QAAQJ,KAOnB,UAAf,MAAAH,OAAA,EAAAA,EAAMI,QACRC,kBAAAA,IAACC,EAAAA,KAAA,CAECC,KAAM,MAAAP,OAAA,EAAAA,EAAMO,KACZH,KAAK,OACLI,MAAM,MAAAR,OAAA,EAAAA,EAAMQ,OAAQ/D,EAAM+D,KAC1BC,KAAMT,EAAKS,KACXC,MAAOV,EAAKU,OALP,GAAGV,EAAKI,QAAQJ,EAAKO,QAAQJ,KAOnB,gBAAf,MAAAH,OAAA,EAAAA,EAAMI,QACRC,kBAAAA,IAACC,EAAAA,KAAA,CAECC,KAAM,MAAAP,OAAA,EAAAA,EAAMO,KACZH,KAAK,aACLI,MAAM,MAAAR,OAAA,EAAAA,EAAMQ,OAAQ/D,EAAM+D,KAC1BC,KAAMT,EAAKS,KACXC,MAAOV,EAAKU,OALP,GAAGV,EAAKI,QAAQJ,EAAKO,QAAQJ,KAOnB,cAAf,MAAAH,OAAA,EAAAA,EAAMI,QACRC,kBAAAA,IAACC,EAAAA,KAAA,CAECC,KAAM,MAAAP,OAAA,EAAAA,EAAMO,KACZH,KAAK,WACLI,MAAM,MAAAR,OAAA,EAAAA,EAAMQ,OAAQ/D,EAAM+D,KAC1BC,KAAMT,EAAKS,KACXC,MAAOV,EAAKU,OALP,GAAGV,EAAKI,QAAQJ,EAAKO,QAAQJ,KAOnB,aAAf,MAAAH,OAAA,EAAAA,EAAMI,QACRC,kBAAAA,IAACC,EAAAA,KAAA,CAECC,KAAM,MAAAP,OAAA,EAAAA,EAAMO,KACZH,KAAK,UACLI,MAAM,MAAAR,OAAA,EAAAA,EAAMQ,OAAQ/D,EAAM+D,KAC1BC,KAAMT,EAAKS,KACXC,MAAOV,EAAKU,OALP,GAAGV,EAAKI,QAAQJ,EAAKO,QAAQJ,KAOnB,eAAf,MAAAH,OAAA,EAAAA,EAAMI,QACRC,kBAAAA,IAACC,EAAAA,KAAA,CAECC,KAAM,MAAAP,OAAA,EAAAA,EAAMO,KACZH,KAAK,YACLI,MAAM,MAAAR,OAAA,EAAAA,EAAMQ,OAAQ/D,EAAM+D,KAC1BC,KAAMT,EAAKS,KACXC,MAAOV,EAAKU,OALP,GAAGV,EAAKI,QAAQJ,EAAKO,QAAQJ,KAOlC,OAEV,CAAC1D,EAAMqD,MAAOrD,EAAM+D,OAQhBG,EAAaC,EAAAA,OAA0B,MAEvCC,EAAMC,EAAAA,aAAa,CAACH,EAAYlE,EAAMoE,MAE5C,SACEE,kBAAAA,KAAC9B,EAAA,CACC+B,MAAO,CACLR,MAAM,OAAAX,IAAMoB,WAAN,EAAApB,EAAYW,OAAQvC,EAAAA,cAAcxB,EAAM+D,MAAMS,KACpDC,QAAQ,OAAAtB,EAAAnD,EAAMwE,WAAN,EAAArB,EAAYsB,SAAU,IAC9BC,QAAQ,OAAAC,EAAA3E,EAAMwE,WAAN,EAAAG,EAAYD,SAAUzE,EAAMuE,KAAKE,OACzCtC,OAAQ,OAAAwC,EAAA5E,EAAMwE,WAAN,EAAAI,EAAYxC,QAEtB1B,kBAAmBV,EAAM6E,iBACzBC,SAAU9E,EAAM+E,iBAAmB,CAAEC,MAAO,GAAKC,WAAY,CAAEC,SAAU,MAAW,CAAA,EACpFC,GAAInF,EAAMmF,GACVC,SAAUpF,EAAMoF,UAAY,EAC5BrD,YAAa/B,EAAM8B,WACnB1B,OAAQJ,EAAMqF,MACd5D,MAAOzB,EAAM+D,KACbuB,YAAatF,EAAMuF,WACnBC,mBAAoBxF,EAAMuF,YAAcvF,EAAMyF,kBAC9CC,oBAAqB1F,EAAM2F,mBAC3BC,YAAa5F,EAAM6F,WACnB1D,qBAAsBnC,EAAMkC,oBAC5BD,iBAAkBjC,EAAMgC,gBACxBhB,UAAWhB,EAAM8F,SACjBrF,UAAWT,EAAMwD,SACjBtC,qBAAsBlB,EAAM+F,oBAC5BC,cAAehG,EAAMiG,aACrBnF,gBAAiBd,EAAMkG,gBAAkBlG,EAAM+F,oBAC/CI,SAAUnG,EAAMuF,WAChB5B,KAAM3D,EAAM2D,MAAQ,SACpByC,UAAWpG,EAAMoG,UACjBC,QAtCyCC,KACtCtG,EAAMuF,YAAcvF,EAAMqG,SAC7BrG,EAAMqG,QAAQC,IAqCdC,QAASvG,EAAMuG,QACfC,YAAaxG,EAAMwG,YACnBpC,MACAqC,IAAKzG,EAAM0G,GAEXC,SAAA,GAAA/C,kBAAAA,IAACgD,EAAAA,OAAA,CACCpG,MAAOP,EAAMC,OAAO2G,SAAS7G,EAAMqF,OAAO7E,MAAMF,KAChDiF,WAAYvF,EAAMuF,YAAcvF,EAAM8G,iBACtCtD,SAAUxD,EAAMwD,YAGhBxD,EAAM+G,YAAcnD,EAAAA,kBAAAA,IAAC,OAAIoD,MAAO,CAAE/C,MAAO,EAAGgD,QAAS,YAAeN,SAAA3G,EAAM2G,UAAY3G,EAAM2G,aAC9F/C,kBAAAA,IAACxC,EAAA,CACCK,MAAOzB,EAAM+D,KACbxC,aAAcvB,EAAMkH,YACpBvF,gBAAiB,mBAAoB3B,EAAQA,EAAMmH,oBAAiB,EAEnER,SAAA1D"}

package/build/{component-BcHiCCC9.js → component-DpVp9dB1.js}

@@ -1,5 +1,5 @@
 import { j as jsxRuntimeExports } from "./jsx-runtime-BrDlu8eK.js";
-import { c as StackMotion } from "./component-jPZYT5iL.js";
+import { c as StackMotion } from "./component-mzzOCXSx.js";
 const Smooth = (props) => {
   return /* @__PURE__ */ jsxRuntimeExports.jsx(
     StackMotion,
@@ -20,4 +20,4 @@ const Smooth = (props) => {
 export {
   Smooth as S
 };
-//# sourceMappingURL=component-BcHiCCC9.js.map
+//# sourceMappingURL=component-DpVp9dB1.js.map

package/build/component-DpVp9dB1.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"component-DpVp9dB1.js","sources":["../src/areas/smooth/component.tsx"],"sourcesContent":["import { FC } from 'react';\n\nimport { StackMotion, StackProps } from '@local/components/stack';\n\nexport const Smooth: FC<StackProps> = (props) => {\n  return (\n    <StackMotion\n      transition={{\n        layout: {\n          duration: 0.3,\n          ease: 'easeInOut',\n          type: 'spring',\n        },\n      }}\n      layout\n      {...props}\n    >\n      {props.children}\n    </StackMotion>\n  );\n};\n"],"names":["jsx"],"mappings":";;AAIO,MAAM,SAAyB,CAAC,UAAU;AAC/C,SACEA,kCAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,YAAY;AAAA,QACV,QAAQ;AAAA,UACN,UAAU;AAAA,UACV,MAAM;AAAA,UACN,MAAM;AAAA,QAAA;AAAA,MACR;AAAA,MAEF,QAAM;AAAA,MACL,GAAG;AAAA,MAEH,UAAA,MAAM;AAAA,IAAA;AAAA,EAAA;AAGb;"}

package/build/{component-DfxlJBGv.js → component-G5QqAuDV.js}

@@ -1,8 +1,8 @@
 import { j as jsxRuntimeExports } from "./jsx-runtime-BrDlu8eK.js";
 import { useRef, useCallback } from "react";
 import { ImageSupportedFormatsForInput } from "./consts.es.js";
-import { u as useImageCrop } from "./use-DTZ8c8_g.js";
-import { c as Button } from "./component-C4ULY0c6.js";
+import { u as useImageCrop } from "./use-Bp4KNVye.js";
+import { c as Button } from "./component-CN6att4f.js";
 const ImageButton = (props) => {
   const refInput = useRef(null);
   const handleOpenFileDialog = useCallback(() => {
@@ -47,4 +47,4 @@ const ImageButton = (props) => {
 export {
   ImageButton as I
 };
-//# sourceMappingURL=component-DfxlJBGv.js.map
+//# sourceMappingURL=component-G5QqAuDV.js.map

package/build/component-G5QqAuDV.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"component-G5QqAuDV.js","sources":["../src/components/image-button/component.tsx"],"sourcesContent":["import { FC, useCallback, useRef } from 'react';\n\nimport { ImageSupportedFormatsForInput } from '@local/consts';\nimport { useImageCrop } from '@local/hooks/use-image-crop';\n\nimport { ImageButtonProps } from '.';\nimport { Button } from '../button';\n\nexport const ImageButton: FC<ImageButtonProps> = (props) => {\n  const refInput = useRef<HTMLInputElement | null>(null);\n\n  const handleOpenFileDialog = useCallback(() => {\n    refInput.current?.click();\n  }, []);\n\n  const { handleAddFiles } = useImageCrop({\n    onSave: props.onSave,\n    locale: props.locale,\n    dialog: props.dialog,\n    imageSettings: props.imageSettings,\n    refInput: refInput,\n  });\n\n  return (\n    <>\n      <Button\n        {...props.button}\n        onClick={(e) => {\n          props.button.onClick?.(e);\n          handleOpenFileDialog();\n        }}\n      >\n        {props.button.children || props.locale.buttonAdd}\n      </Button>\n      <input\n        ref={refInput}\n        type='file'\n        accept={ImageSupportedFormatsForInput}\n        multiple\n        style={{ display: 'none' }}\n        onChange={(e) => {\n          if (e.target.files) handleAddFiles(e.target.files);\n        }}\n      />\n    </>\n  );\n};\n"],"names":["jsxs","Fragment","jsx"],"mappings":";;;;;AAQO,MAAM,cAAoC,CAAC,UAAU;AAC1D,QAAM,WAAW,OAAgC,IAAI;AAErD,QAAM,uBAAuB,YAAY,MAAM;;AAC7C,mBAAS,YAAT,mBAAkB;AAAA,EAAM,GACvB,EAAE;AAEL,QAAM,EAAE,eAAA,IAAmB,aAAa;AAAA,IACtC,QAAQ,MAAM;AAAA,IACd,QAAQ,MAAM;AAAA,IACd,QAAQ,MAAM;AAAA,IACd,eAAe,MAAM;AAAA,IACrB;AAAA,EAAA,CACD;AAED,SACEA,kCAAAA,KAAAC,4BAAA,EACE,UAAA;AAAA,IAAAC,kCAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAG,MAAM;AAAA,QACV,SAAS,CAAC,MAAM;;AACd,4BAAM,QAAO,YAAb,4BAAuB;AACvB,+BAAA;AAAA,QAAqB;AAAA,QAGtB,UAAA,MAAM,OAAO,YAAY,MAAM,OAAO;AAAA,MAAA;AAAA,IAAA;AAAA,IAEzCA,kCAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAK;AAAA,QACL,MAAK;AAAA,QACL,QAAQ;AAAA,QACR,UAAQ;AAAA,QACR,OAAO,EAAE,SAAS,OAAA;AAAA,QAClB,UAAU,CAAC,MAAM;AACf,cAAI,EAAE,OAAO,MAAO,gBAAe,EAAE,OAAO,KAAK;AAAA,QAAA;AAAA,MACnD;AAAA,IAAA;AAAA,EACF,GACF;AAEJ;"}

package/build/component-GKvpOWlO.cjs

@@ -0,0 +1,28 @@
+"use strict";const e=require("./jsx-runtime-BcGej2Kr.cjs"),r=require("framer-motion"),o=require("styled-components"),s=require("./style-fRZ6xrVp.cjs"),t=require("./component.styles-Dpg-__rn.cjs");require("react");const i=o.div`
+  display: flex;
+  ${s.addSX}
+
+  ${e=>e.$isHover&&o.css`
+      transition:
+        background-color ${e=>e.theme.transition.default},
+        outline 0s;
+      &:hover {
+        background-color: ${e=>e.theme.palette.black05};
+      }
+    `};
+  ${t.addRipple};
+`,n=o(r.motion.div)`
+  display: flex;
+  ${s.addSX}
+
+  ${e=>e.$isHover&&o.css`
+      transition:
+        background-color ${e=>e.theme.transition.default},
+        outline 0s;
+      &:hover {
+        background-color: ${e=>e.theme.palette.black05};
+      }
+    `};
+  ${t.addRipple};
+`;exports.Stack=r=>e.jsxRuntimeExports.jsx(i,{ref:r.ref,onClick:r.onClick,onDrop:r.onDrop,onDragOver:r.onDragOver,className:r.className,$sx:r.sx,$isHover:r.isHover,$isRipple:r.isRipple,children:r.children}),exports.StackMotion=r=>{const{style:o,className:s,isHover:t,isRipple:i,onClick:l,onDrop:a,onDragOver:c,ref:p,sx:d}=r;return e.jsxRuntimeExports.jsx(n,{ref:p,style:o,onClick:l,onDrop:a,onDragOver:c,className:s,$sx:d,$isHover:t,$isRipple:i,...r,children:r.children})},exports.StyledStack=i,exports.StyledStackMotion=n;
+//# sourceMappingURL=component-GKvpOWlO.cjs.map

package/build/component-GKvpOWlO.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"component-GKvpOWlO.cjs","sources":["../src/components/stack/component.styles.tsx","../src/components/stack/component.tsx"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\n\nimport { addSX } from '@local/styles/sx';\n\nimport { StyledStackProps } from '.';\nimport { addRipple } from '../ripple';\n\nexport const StyledStack = styled.div<StyledStackProps>`\n  display: flex;\n  ${addSX}\n\n  ${(props) =>\n    props.$isHover &&\n    css`\n      transition:\n        background-color ${(props) => props.theme.transition.default},\n        outline 0s;\n      &:hover {\n        background-color: ${(props) => props.theme.palette.black05};\n      }\n    `};\n  ${addRipple};\n`;\n\nexport const StyledStackMotion = styled(motion.div)<StyledStackProps>`\n  display: flex;\n  ${addSX}\n\n  ${(props) =>\n    props.$isHover &&\n    css`\n      transition:\n        background-color ${(props) => props.theme.transition.default},\n        outline 0s;\n      &:hover {\n        background-color: ${(props) => props.theme.palette.black05};\n      }\n    `};\n  ${addRipple};\n`;\n","import { FC } from 'react';\n\nimport { StackMotionProps, StackProps, StyledStack, StyledStackMotion } from '.';\n\nexport const Stack: FC<StackProps> = (props) => {\n  return (\n    <StyledStack\n      ref={props.ref}\n      onClick={props.onClick}\n      onDrop={props.onDrop}\n      onDragOver={props.onDragOver}\n      className={props.className}\n      $sx={props.sx}\n      $isHover={props.isHover}\n      $isRipple={props.isRipple}\n    >\n      {props.children}\n    </StyledStack>\n  );\n};\n\nexport const StackMotion: FC<StackMotionProps> = (props) => {\n  const { style, className, isHover, isRipple, onClick, onDrop, onDragOver, ref, sx } = props;\n  return (\n    <StyledStackMotion\n      ref={ref}\n      style={style}\n      onClick={onClick}\n      onDrop={onDrop}\n      onDragOver={onDragOver}\n      className={className}\n      $sx={sx}\n      $isHover={isHover}\n      $isRipple={isRipple}\n      {...props}\n    >\n      {props.children}\n    </StyledStackMotion>\n  );\n};\n"],"names":["StyledStack","styled","div","addSX","props","$isHover","css","theme","transition","default","palette","black05","addRipple","StyledStackMotion","motion","jsx","ref","onClick","onDrop","onDragOver","className","$sx","sx","isHover","$isRipple","isRipple","children","style"],"mappings":"qNAQO,MAAMA,EAAcC,EAAOC,GAAA;;IAE9BC,EAAAA;;IAECC,GACDA,EAAMC,UACNC,EAAAA,GAAAA;;2BAEwBF,GAAUA,EAAMG,MAAMC,WAAWC;;;4BAGhCL,GAAUA,EAAMG,MAAMG,QAAQC;;;IAGvDC;EAGSC,EAAoBZ,EAAOa,EAAAA,OAAOZ,IAAG;;IAE9CC,EAAAA;;IAECC,GACDA,EAAMC,UACNC,EAAAA,GAAAA;;2BAEwBF,GAAUA,EAAMG,MAAMC,WAAWC;;;4BAGhCL,GAAUA,EAAMG,MAAMG,QAAQC;;;IAGvDC;gBCnCkCR,KAElCW,kBAAAA,IAACf,EAAA,CACCgB,IAAKZ,EAAMY,IACXC,QAASb,EAAMa,QACfC,OAAQd,EAAMc,OACdC,WAAYf,EAAMe,WAClBC,UAAWhB,EAAMgB,UACjBC,IAAKjB,EAAMkB,GACXjB,SAAUD,EAAMmB,QAChBC,UAAWpB,EAAMqB,SAEhBC,SAAAtB,EAAMsB,+BAKqCtB,IAChD,MAAQuB,MAAAA,EAAAA,UAAOP,EAAAG,QAAWA,EAAAE,SAASA,EAAAR,QAAUA,EAAAC,OAASA,EAAAC,WAAQA,EAAAH,IAAYA,EAAAM,GAAKA,GAAOlB,EACtF,SACEW,kBAAAA,IAACF,EAAA,CACCG,MACAW,MAAAA,EACAV,UACAC,SACAC,aACAC,YACAC,IAAKC,EACLjB,SAAUkB,EACVC,UAAWC,KACPrB,EAEHsB,SAAAtB,EAAMsB"}