npm - @jenesei-software/jenesei-kit-react - Versions diffs - 1.3.8 → 1.3.10 - Mend

@jenesei-software/jenesei-kit-react 1.3.8 → 1.3.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (292) hide show

package/build/{component.styles-DYAuT7U2.js → component.styles-DS0ofW1Y.js} RENAMED Viewed

@@ -1,9 +1,23 @@
 import { j as jsxRuntimeExports } from "./jsx-runtime-BrDlu8eK.js";
-import { J as JeneseiPalette, K as KEY_SIZE_DATA } from "./theme.global-DuEXPcSK.js";
+import { J as JeneseiPalette, K as KEY_SIZE_DATA } from "./theme.global-BgERDJ4e.js";
 import { useMemo } from "react";
 import styled, { css } from "styled-components";
-import { e as addColorTransition } from "./style-BgcnmVAY.js";
+import { f as addColorTransition } from "./style-RL73t3JD.js";
 import { a as addSX } from "./style-plT9Ah7t.js";
+const Card = "<g fill='none' stroke='currentColor' strokewidth='{1.5}'><path d='M2 12c0-3.771 0-5.657 1.172-6.828S6.229 4 10 4h4c3.771 0 5.657 0 6.828 1.172S22 8.229 22 12s0 5.657-1.172 6.828S17.771 20 14 20h-4c-3.771 0-5.657 0-6.828-1.172S2 15.771 2 12Z'></path><path strokelinecap='round' d='M10 16H6m8 0h-1.5M2 10h20'></path></g>";
+const Delivery = "<g fill='none' stroke='currentColor' strokelinecap='round' strokelinejoin='round' strokewidth='{1.5}'><path d='M16 6.25v9.51q-.18.225-.29.49H8.29a2.5 2.5 0 0 0-4.58 0H3a1 1 0 0 1-1-1v-9a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2m6 7.11v2.89h-1.71a2.49 2.49 0 0 0-4.29-.49V7.25h2.43a1 1 0 0 1 .86.49l.91 1.51l1.23 2.05a4 4 0 0 1 .57 2.06'></path><path d='M8.5 17.25a2.5 2.5 0 1 1-4.79-1a2.5 2.5 0 0 1 4.79 1m12 0a2.5 2.5 0 1 1-4.79-1q.11-.265.29-.49a2.49 2.49 0 0 1 4.29.49c.14.315.212.656.21 1m-9.5-6H6m5-3H6'></path></g>";
+const Heart$2 = "<path fill='currentColor' d='m8.962 18.91l.464-.588zM12 5.5l-.54.52a.75.75 0 0 0 1.08 0zm3.038 13.41l.465.59zm-5.612-.588C7.91 17.127 6.253 15.96 4.938 14.48C3.65 13.028 2.75 11.335 2.75 9.137h-1.5c0 2.666 1.11 4.7 2.567 6.339c1.43 1.61 3.254 2.9 4.68 4.024zM2.75 9.137c0-2.15 1.215-3.954 2.874-4.713c1.612-.737 3.778-.541 5.836 1.597l1.08-1.04C10.1 2.444 7.264 2.025 5 3.06C2.786 4.073 1.25 6.425 1.25 9.137zM8.497 19.5c.513.404 1.063.834 1.62 1.16s1.193.59 1.883.59v-1.5c-.31 0-.674-.12-1.126-.385c-.453-.264-.922-.628-1.448-1.043zm7.006 0c1.426-1.125 3.25-2.413 4.68-4.024c1.457-1.64 2.567-3.673 2.567-6.339h-1.5c0 2.198-.9 3.891-2.188 5.343c-1.315 1.48-2.972 2.647-4.488 3.842zM22.75 9.137c0-2.712-1.535-5.064-3.75-6.077c-2.264-1.035-5.098-.616-7.54 1.92l1.08 1.04c2.058-2.137 4.224-2.333 5.836-1.596c1.659.759 2.874 2.562 2.874 4.713zm-8.176 9.185c-.526.415-.995.779-1.448 1.043s-.816.385-1.126.385v1.5c.69 0 1.326-.265 1.883-.59c.558-.326 1.107-.756 1.62-1.16z'></path>";
+const Reviews = "<g fill='none'><path fill='currentColor' d='m13.087 21.388l.645.382zm.542-.916l-.646-.382zm-3.258 0l-.645.382zm.542.916l.646-.382zm-8.532-5.475l.693-.287zm5.409 3.078l-.013.75zm-2.703-.372l-.287.693zm16.532-2.706l.693.287zm-5.409 3.078l-.012-.75zm2.703-.372l.287.693zm.7-15.882l-.392.64zm1.65 1.65l.64-.391zM4.388 2.738l-.392-.64zm-1.651 1.65l-.64-.391zM9.403 19.21l.377-.649zm4.33 2.56l.541-.916l-1.29-.764l-.543.916zm-4.007-.916l.542.916l1.29-.764l-.541-.916zm2.715.152a.52.52 0 0 1-.882 0l-1.291.764c.773 1.307 2.69 1.307 3.464 0zM10.5 2.75h3v-1.5h-3zm10.75 7.75v1h1.5v-1zm-18.5 1v-1h-1.5v1zm-1.5 0c0 1.155 0 2.058.05 2.787c.05.735.153 1.347.388 1.913l1.386-.574c-.147-.352-.233-.782-.278-1.441c-.046-.666-.046-1.51-.046-2.685zm6.553 6.742c-1.256-.022-1.914-.102-2.43-.316L4.8 19.313c.805.334 1.721.408 2.977.43zM1.688 16.2A5.75 5.75 0 0 0 4.8 19.312l.574-1.386a4.25 4.25 0 0 1-2.3-2.3zm19.562-4.7c0 1.175 0 2.019-.046 2.685c-.045.659-.131 1.089-.277 1.441l1.385.574c.235-.566.338-1.178.389-1.913c.05-.729.049-1.632.049-2.787zm-5.027 8.241c1.256-.021 2.172-.095 2.977-.429l-.574-1.386c-.515.214-1.173.294-2.428.316zm4.704-4.115a4.25 4.25 0 0 1-2.3 2.3l.573 1.386a5.75 5.75 0 0 0 3.112-3.112zM13.5 2.75c1.651 0 2.837 0 3.762.089c.914.087 1.495.253 1.959.537l.783-1.279c-.739-.452-1.577-.654-2.6-.752c-1.012-.096-2.282-.095-3.904-.095zm9.25 7.75c0-1.622 0-2.891-.096-3.904c-.097-1.023-.299-1.862-.751-2.6l-1.28.783c.285.464.451 1.045.538 1.96c.088.924.089 2.11.089 3.761zm-3.53-7.124a4.25 4.25 0 0 1 1.404 1.403l1.279-.783a5.75 5.75 0 0 0-1.899-1.899zM10.5 1.25c-1.622 0-2.891 0-3.904.095c-1.023.098-1.862.3-2.6.752l.783 1.28c.464-.285 1.045-.451 1.96-.538c.924-.088 2.11-.089 3.761-.089zM2.75 10.5c0-1.651 0-2.837.089-3.762c.087-.914.253-1.495.537-1.959l-1.279-.783c-.452.738-.654 1.577-.752 2.6C1.25 7.61 1.25 8.878 1.25 10.5zm1.246-8.403a5.75 5.75 0 0 0-1.899 1.899l1.28.783a4.25 4.25 0 0 1 1.402-1.403zm7.02 17.993c-.202-.343-.38-.646-.554-.884a2.2 2.2 0 0 0-.682-.645l-.754 1.297c.047.028.112.078.224.232c.121.166.258.396.476.764zm-3.24-.349c.44.008.718.014.93.037c.198.022.275.054.32.08l.754-1.297a2.2 2.2 0 0 0-.909-.274c-.298-.033-.657-.038-1.069-.045zm6.498 1.113c.218-.367.355-.598.476-.764c.112-.154.177-.204.224-.232l-.754-1.297c-.29.17-.5.395-.682.645c-.173.238-.352.54-.555.884zm1.924-2.612c-.412.007-.771.012-1.069.045c-.311.035-.616.104-.909.274l.754 1.297c.045-.026.122-.058.32-.08c.212-.023.49-.03.93-.037z'></path><path stroke='currentColor' strokelinecap='round' strokewidth='{1.5}' d='M8 9h8m-8 3.5h5.5'></path></g>";
+const Search$1 = "<path fill='currentColor' fillrule='evenodd' d='m16.325 14.899l5.38 5.38a1.008 1.008 0 0 1-1.427 1.426l-5.38-5.38a8 8 0 1 1 1.426-1.426M10 16a6 6 0 1 0 0-12a6 6 0 0 0 0 12'></path>";
+const Menu = "<path fill='none' stroke='currentColor' strokelinecap='round' strokewidth='{1.5}' d='M20 7H4m16 5H4m16 5H4'></path>";
+const IconBustMarketJSON = {
+  Card,
+  Delivery,
+  Heart: Heart$2,
+  Reviews,
+  Search: Search$1,
+  Menu
+};
 const Radio = {
   paths: [
     {
@@ -2024,8 +2038,25 @@ const Jenesei = {
     }
   ]
 };
+const BustMarket = {
+  paths: [
+    {
+      d: "M4.21255 2.79483C3.946 2.82496 3.65536 2.94549 3.42646 3.11723C3.12376 3.34622 2.91293 3.67463 2.82107 4.06633L2.78945 4.20191L2.78493 11.8926C2.78192 16.9229 2.78644 19.6361 2.79547 19.734C2.80451 19.8168 2.82408 19.9374 2.84065 20.0007C2.87378 20.1287 2.97618 20.3773 2.99275 20.3713C3.00931 20.3637 6.41573 17.0344 6.44585 16.9952C6.46091 16.9756 6.46844 16.95 6.46392 16.9379C6.45941 16.9243 6.19285 16.8008 5.8495 16.6532C5.18387 16.367 5.15075 16.3519 5.05889 16.263C4.79836 16.0099 4.79083 15.5986 5.04232 15.3244C5.07093 15.2944 6.14014 14.2684 7.42018 13.0451C8.88846 11.6395 9.92605 10.6347 10.2333 10.3198C10.5013 10.0457 10.7302 9.80612 10.7423 9.78804C10.7573 9.76696 10.7618 9.74737 10.7528 9.7308C10.7453 9.71875 10.3598 9.45963 9.89593 9.15531C9.43361 8.8525 9.02551 8.58133 8.98937 8.55271C8.79661 8.39603 8.71227 8.10226 8.78907 7.8567C8.84178 7.68646 8.96678 7.5343 9.11737 7.45899C9.15653 7.43789 11.3928 6.79612 14.0839 6.03082L18.9783 4.6388H19.1438C19.3005 4.6388 19.3155 4.64181 19.412 4.68852C19.6634 4.81205 19.8231 5.08924 19.7929 5.35137C19.7794 5.48244 17.8051 13.2801 17.7659 13.3615C17.7102 13.4775 17.5823 13.6025 17.4542 13.6658C17.3564 13.714 17.3247 13.7215 17.2102 13.7276C17.0656 13.7351 16.9422 13.708 16.8473 13.6507C16.8187 13.6327 16.3896 13.3329 15.8955 12.9818C14.8414 12.2361 14.8851 12.2663 14.858 12.2768C14.8459 12.2813 14.6125 12.5163 14.3399 12.8011C14.0659 13.0843 13.6999 13.4609 13.5267 13.6402C12.2798 14.9192 11.5088 15.7267 11.5088 15.7538C11.5088 15.778 11.6172 15.8503 12.0434 16.1063C12.3506 16.2916 12.6051 16.4543 12.6428 16.492C12.8491 16.6924 12.9003 17.0087 12.7662 17.2709C12.7482 17.307 12.6955 17.3748 12.6518 17.4215C12.5765 17.5014 12.3371 17.6355 9.22881 19.3589L5.88715 21.2104L12.7346 21.2149C17.5521 21.2179 19.6288 21.2149 19.7418 21.2029C20.5113 21.126 21.1046 20.5461 21.198 19.7792C21.222 19.5863 21.222 4.40981 21.198 4.21697C21.1437 3.77858 20.9179 3.37936 20.579 3.12024C20.3862 2.97411 20.1935 2.88372 19.9344 2.81894L19.8065 2.7873L12.066 2.78429C7.80571 2.78278 4.2743 2.7873 4.21255 2.79483Z",
+      fill: "primaryColor"
+    }
+  ]
+};
 const IconLogoJSON = {
-  Jenesei
+  Jenesei,
+  BustMarket
+};
+const MapCluster = {
+  paths: [
+    {
+      d: "M15 21L9 18.9L4.35 20.7C4.01667 20.8333 3.70833 20.796 3.425 20.588C3.14167 20.38 3 20.1007 3 19.75V5.75C3 5.53333 3.06267 5.34167 3.188 5.175C3.31333 5.00833 3.484 4.88333 3.7 4.8L9 3L15 5.1L19.65 3.3C19.9833 3.16667 20.2917 3.20433 20.575 3.413C20.8583 3.62167 21 3.90067 21 4.25V18.25C21 18.4667 20.9377 18.6583 20.813 18.825C20.6883 18.9917 20.5173 19.1167 20.3 19.2L15 21ZM14 18.55V6.85L10 5.45V17.15L14 18.55Z",
+      fill: "primaryColor"
+    }
+  ]
 };
 const HomeLikes = {
   paths: [
@@ -2060,14 +2091,7 @@ const User = {
   ]
 };
 const IconRealEbailJSON = {
-  "Map": {
-    paths: [
-      {
-        d: "M15 21L9 18.9L4.35 20.7C4.01667 20.8333 3.70833 20.796 3.425 20.588C3.14167 20.38 3 20.1007 3 19.75V5.75C3 5.53333 3.06267 5.34167 3.188 5.175C3.31333 5.00833 3.484 4.88333 3.7 4.8L9 3L15 5.1L19.65 3.3C19.9833 3.16667 20.2917 3.20433 20.575 3.413C20.8583 3.62167 21 3.90067 21 4.25V18.25C21 18.4667 20.9377 18.6583 20.813 18.825C20.6883 18.9917 20.5173 19.1167 20.3 19.2L15 21ZM14 18.55V6.85L10 5.45V17.15L14 18.55Z",
-        fill: "primaryColor"
-      }
-    ]
-  },
+  MapCluster,
   HomeLikes,
   HomeManagement,
   UserSettings,
@@ -2080,6 +2104,9 @@ const Icon = (props) => {
       case "id":
         icon2 = IconIdJSON[props.name];
         break;
+      case "bustmarket":
+        icon2 = IconBustMarketJSON[props.name];
+        break;
       case "realebail":
         icon2 = IconRealEbailJSON[props.name];
         break;
@@ -2117,7 +2144,7 @@ const Icon = (props) => {
     },
     `${props.type}-${props.name}-path-${index}`
   )) : null;
-  const contentLoadings = props.type === "loading" ? icon : null;
+  const isFull = props.type === "loading" || props.type === "bustmarket" ? icon : null;
   return /* @__PURE__ */ jsxRuntimeExports.jsx(
     StyledSVG,
     {
@@ -2133,7 +2160,7 @@ const Icon = (props) => {
       className: props.className,
       onClick: props.onClick,
       tabIndex: props.tabIndex,
-      dangerouslySetInnerHTML: contentLoadings ? { __html: contentLoadings } : void 0,
+      dangerouslySetInnerHTML: isFull ? { __html: isFull } : void 0,
       children: contentPaths
     }
   );
@@ -2163,4 +2190,4 @@ export {
   Icon as I,
   StyledSVG as S
 };
-//# sourceMappingURL=component.styles-DYAuT7U2.js.map
+//# sourceMappingURL=component.styles-DS0ofW1Y.js.map

package/build/component.styles-DS0ofW1Y.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"component.styles-DS0ofW1Y.js","sources":["../src/components/icon/component.tsx","../src/components/icon/component.styles.ts"],"sourcesContent":["import { JeneseiPalette } from '@local/theme/theme';\n\nimport { useMemo } from 'react';\n\nimport IconBustMarketJSON from './component-bustmarket.json';\nimport IconCheckboxJSON from './component-checkbox.json';\nimport IconIdJSON from './component-id.json';\nimport IconLoadingJSON from './component-loading.json';\nimport IconLogoJSON from './component-logo.json';\nimport IconRealEbailJSON from './component-realebail.json';\nimport {\n IconItemProps,\n IconTypeMap,\n StyledSVG,\n TIconBustMarketNameString,\n TIconCheckboxNameString,\n TIconIdNameString,\n TIconLoadingNameString,\n TIconLogoNameString,\n TIconRealEbailNameString,\n} from '.';\n\nexport const Icon = <T extends keyof IconTypeMap>(props: IconItemProps<T>) => {\n const icon = useMemo(() => {\n let icon = null;\n\n switch (props.type) {\n case 'id':\n icon = IconIdJSON[props.name as TIconIdNameString];\n break;\n case 'bustmarket':\n icon = IconBustMarketJSON[props.name as TIconBustMarketNameString];\n break;\n case 'realebail':\n icon = IconRealEbailJSON[props.name as TIconRealEbailNameString];\n break;\n case 'logo':\n icon = IconLogoJSON[props.name as TIconLogoNameString];\n break;\n case 'checkbox':\n icon = IconCheckboxJSON[props.name as TIconCheckboxNameString];\n break;\n case 'loading':\n icon = IconLoadingJSON[props.name as TIconLoadingNameString];\n break;\n }\n return icon;\n }, [props.name, props.type]);\n\n const primaryColor = props.primaryColor ? JeneseiPalette[props.primaryColor] : 'currentColor';\n const secondColor = props.secondColor ? JeneseiPalette[props.secondColor] : 'currentColor';\n\n if (!icon) {\n console.warn(`Icon ${props.name} not found in the library.`);\n return null;\n }\n\n const getFillColor = (fillType?: string): string | undefined => {\n if (fillType === 'primaryColor') return primaryColor;\n if (fillType === 'secondColor') return secondColor;\n return 'currentColor';\n };\n\n const contentPaths =\n (props.type == 'id' || props.type === 'checkbox' || props.type === 'realebail' || props.type === 'logo') &&\n typeof icon === 'object' &&\n 'paths' in icon\n ? (icon.paths ?? []).map((path, index) => (\n <path\n key={`${props.type}-${props.name}-path-${index}`}\n id={'id' in path ? (path.id as string) : undefined}\n d={path.d}\n clipRule='evenodd'\n fillRule='evenodd'\n fill={'fill' in path ? getFillColor(path.fill as string) : 'currentColor'}\n />\n ))\n : null;\n\n const isFull = props.type === 'loading' || props.type === 'bustmarket' ? (icon as string) : null;\n\n return (\n <StyledSVG\n width='24'\n height='24'\n viewBox='0 0 24 24'\n xmlns='http://www.w3.org/2000/svg'\n $size={props.size}\n $turn={props.turn}\n $order={props.order}\n $color={props.primaryColor || undefined}\n $sx={props.sx}\n className={props.className}\n onClick={props.onClick}\n tabIndex={props.tabIndex}\n dangerouslySetInnerHTML={isFull ? { __html: isFull } : undefined}\n >\n {contentPaths}\n </StyledSVG>\n );\n};\n","import styled, { css } from 'styled-components'\n\nimport { addColorTransition } from '@local/styles/add'\nimport { addSX } from '@local/styles/sx'\nimport { KEY_SIZE_DATA } from '@local/theme'\n\nimport { StyledIconIdItemProps } from '.'\n\nexport const StyledSVG = styled.svg<StyledIconIdItemProps>`\n color: ${props => (props.$color ? props.theme.palette[props.$color] : 'inherit')};\n\n ${props => css`\n height: ${props.$size !== '100%' ? `${KEY_SIZE_DATA[props.$size].heightIcon}px` : '100%'};\n min-height: ${props.$size !== '100%' ? `${KEY_SIZE_DATA[props.$size].heightIcon}px` : '100%'};\n\n width: ${props.$size !== '100%' ? `${KEY_SIZE_DATA[props.$size].heightIcon}px` : '100%'};\n min-width: ${props.$size !== '100%' ? `${KEY_SIZE_DATA[props.$size].heightIcon}px` : '100%'};\n\n transform: rotate(${props.$turn || 0}deg);\n `}\n ${props =>\n props.$order !== undefined &&\n css`\n order: ${props.$order};\n `};\n ${addColorTransition};\n & path {\n ${addColorTransition};\n }\n ${addSX};\n`\n"],"names":["icon","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsBO,MAAM,OAAO,CAA8B,UAA4B;AAC5E,QAAM,OAAO,QAAQ,MAAM;AACzB,QAAIA,QAAO;AAEX,YAAQ,MAAM,MAAA;AAAA,MACZ,KAAK;AACHA,gBAAO,WAAW,MAAM,IAAyB;AACjD;AAAA,MACF,KAAK;AACHA,gBAAO,mBAAmB,MAAM,IAAiC;AACjE;AAAA,MACF,KAAK;AACHA,gBAAO,kBAAkB,MAAM,IAAgC;AAC/D;AAAA,MACF,KAAK;AACHA,gBAAO,aAAa,MAAM,IAA2B;AACrD;AAAA,MACF,KAAK;AACHA,gBAAO,iBAAiB,MAAM,IAA+B;AAC7D;AAAA,MACF,KAAK;AACHA,gBAAO,gBAAgB,MAAM,IAA8B;AAC3D;AAAA,IAAA;AAEJ,WAAOA;AAAAA,EAAA,GACN,CAAC,MAAM,MAAM,MAAM,IAAI,CAAC;AAE3B,QAAM,eAAe,MAAM,eAAe,eAAe,MAAM,YAAY,IAAI;AAC/E,QAAM,cAAc,MAAM,cAAc,eAAe,MAAM,WAAW,IAAI;AAE5E,MAAI,CAAC,MAAM;AACT,YAAQ,KAAK,QAAQ,MAAM,IAAI,4BAA4B;AAC3D,WAAO;AAAA,EAAA;AAGT,QAAM,eAAe,CAAC,aAA0C;AAC9D,QAAI,aAAa,eAAgB,QAAO;AACxC,QAAI,aAAa,cAAe,QAAO;AACvC,WAAO;AAAA,EAAA;AAGT,QAAM,gBACH,MAAM,QAAQ,QAAQ,MAAM,SAAS,cAAc,MAAM,SAAS,eAAe,MAAM,SAAS,WACjG,OAAO,SAAS,YAChB,WAAW,QACN,KAAK,SAAS,CAAA,GAAI,IAAI,CAAC,MAAM,UAC5BC,kCAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MAEC,IAAI,QAAQ,OAAQ,KAAK,KAAgB;AAAA,MACzC,GAAG,KAAK;AAAA,MACR,UAAS;AAAA,MACT,UAAS;AAAA,MACT,MAAM,UAAU,OAAO,aAAa,KAAK,IAAc,IAAI;AAAA,IAAA;AAAA,IALtD,GAAG,MAAM,IAAI,IAAI,MAAM,IAAI,SAAS,KAAK;AAAA,EAAA,CAOjD,IACD;AAEN,QAAM,SAAS,MAAM,SAAS,aAAa,MAAM,SAAS,eAAgB,OAAkB;AAE5F,SACEA,kCAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,QAAO;AAAA,MACP,SAAQ;AAAA,MACR,OAAM;AAAA,MACN,OAAO,MAAM;AAAA,MACb,OAAO,MAAM;AAAA,MACb,QAAQ,MAAM;AAAA,MACd,QAAQ,MAAM,gBAAgB;AAAA,MAC9B,KAAK,MAAM;AAAA,MACX,WAAW,MAAM;AAAA,MACjB,SAAS,MAAM;AAAA,MACf,UAAU,MAAM;AAAA,MAChB,yBAAyB,SAAS,EAAE,QAAQ,WAAW;AAAA,MAEtD,UAAA;AAAA,IAAA;AAAA,EAAA;AAGP;AC5FO,MAAM,YAAY,OAAO;AAAA,WACrB,CAAA,UAAU,MAAM,SAAS,MAAM,MAAM,QAAQ,MAAM,MAAM,IAAI,SAAU;AAAA;AAAA,IAE9E,CAAA,UAAS;AAAA,cACC,MAAM,UAAU,SAAS,GAAG,cAAc,MAAM,KAAK,EAAE,UAAU,OAAO,MAAM;AAAA,kBAC1E,MAAM,UAAU,SAAS,GAAG,cAAc,MAAM,KAAK,EAAE,UAAU,OAAO,MAAM;AAAA;AAAA,aAEnF,MAAM,UAAU,SAAS,GAAG,cAAc,MAAM,KAAK,EAAE,UAAU,OAAO,MAAM;AAAA,iBAC1E,MAAM,UAAU,SAAS,GAAG,cAAc,MAAM,KAAK,EAAE,UAAU,OAAO,MAAM;AAAA;AAAA,wBAEvE,MAAM,SAAS,CAAC;AAAA,GACrC;AAAA,IACC,CAAA,UACA,MAAM,WAAW,UACjB;AAAA,eACW,MAAM,MAAM;AAAA,KACtB;AAAA,IACD,kBAAkB;AAAA;AAAA,MAEhB,kBAAkB;AAAA;AAAA,IAEpB,KAAK;AAAA;"}

package/build/component.styles-DWGUgUoF.cjs ADDED Viewed

@@ -0,0 +1,21 @@
+"use strict";const e=require("./jsx-runtime-BcGej2Kr.cjs"),i=require("./component.styles-BpvpyZax.cjs"),l=require("./theme.global-CcoD5bPP.cjs"),o=require("react"),s=require("styled-components"),n=require("./style-Df37KnoJ.cjs"),t=require("./style-fRZ6xrVp.cjs"),r=s.css`
+  ${e=>d(l.KEY_SIZE_DATA[e.$size])};
+`,d=e=>s.css`
+  gap: ${e.padding-2}px;
+`,c=s.div`
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  ${r};
+  ${n.addFont};
+  ${t.addSX};
+`,u=s.div`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+`,a=s.div`
+  user-select: none;
+`,x=s.div`
+  user-select: none;
+`;exports.CheckboxChildren=x,exports.CheckboxGroup=n=>{var t,r,d,h;const p=o.useCallback(e=>{const i=n.value.some(i=>i[n.valueField]===e[n.valueField])?n.value.filter(i=>i[n.valueField]!==e[n.valueField]):n.multiple?[...n.value,e]:[e];n.onChange&&n.onChange(i)},[n]),v=s.useTheme();return e.jsxRuntimeExports.jsx(c,{className:n.className,$sx:n.sx,$size:n.size,$font:{size:(null==(t=n.font)?void 0:t.size)??l.KEY_SIZE_DATA[n.size].font,weight:(null==(r=n.font)?void 0:r.weight)??700,family:(null==(d=n.font)?void 0:d.family)??v.font.family,height:null==(h=n.font)?void 0:h.height},children:n.options.map((o,s)=>{var t,r,d,c;const h=n.value.some(e=>e[n.valueField]===o[n.valueField]);return e.jsxRuntimeExports.jsxs(u,{onClick:()=>!n.isClickOnlyIcon&&p(o),children:[e.jsxRuntimeExports.jsx(i.Checkbox,{genre:n.checkboxGenre,isHiddenBorder:n.checkboxIsHiddenBorder,view:n.checkBoxView,sx:n.checkboxSX,size:n.size,checked:h,font:{size:(null==(t=n.font)?void 0:t.size)??l.KEY_SIZE_DATA[n.size].font,weight:(null==(r=n.font)?void 0:r.weight)??700,family:(null==(d=n.font)?void 0:d.family)??v.font.family,height:null==(c=n.font)?void 0:c.height},children:n.labelField&&void 0!==(null==o?void 0:o[n.labelField])&&e.jsxRuntimeExports.jsx(a,{dangerouslySetInnerHTML:(m=o[n.labelField],{__html:m})})}),n.childrenField&&void 0!==(null==o?void 0:o[n.childrenField])&&e.jsxRuntimeExports.jsx(x,{children:o[n.childrenField]})]},s);var m})})},exports.CheckboxGroupItem=u,exports.CheckboxGroupLabel=a,exports.CheckboxGroupSize=r,exports.CheckboxGroupSizeConstructor=d,exports.CheckboxGroupWrapper=c;
+//# sourceMappingURL=component.styles-DWGUgUoF.cjs.map

package/build/component.styles-DWGUgUoF.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"component.styles-DWGUgUoF.cjs","sources":["../src/components/checkbox-group/component.styles.ts","../src/components/checkbox-group/component.tsx"],"sourcesContent":["import { addFont } from '@local/styles/add';\nimport { addSX } from '@local/styles/sx';\nimport { IThemeSizePropertyDefault, KEY_SIZE_DATA } from '@local/theme';\n\nimport styled, { css } from 'styled-components';\n\nimport { CheckboxGroupWrapperProps } from '.';\n\n/****************************************** Size *************************************************/\nexport const CheckboxGroupSize = css<CheckboxGroupWrapperProps>`\n ${(props) => CheckboxGroupSizeConstructor(KEY_SIZE_DATA[props.$size])};\n`;\nexport const CheckboxGroupSizeConstructor = (props: IThemeSizePropertyDefault) => css`\n gap: ${props.padding - 2}px;\n`;\n\n/****************************************** Default *************************************************/\nexport const CheckboxGroupWrapper = styled.div<CheckboxGroupWrapperProps>`\n display: flex;\n flex-direction: column;\n align-items: stretch;\n ${CheckboxGroupSize};\n ${addFont};\n ${addSX};\n`;\n\nexport const CheckboxGroupItem = styled.div`\n display: flex;\n flex-direction: row;\n align-items: center;\n`;\n\nexport const CheckboxGroupLabel = styled.div`\n user-select: none;\n`;\n\nexport const CheckboxChildren = styled.div`\n user-select: none;\n`;\n","import { Checkbox } from '@local/components/checkbox';\nimport { KEY_SIZE_DATA } from '@local/theme';\n\nimport { ReactNode, useCallback } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport {\n CheckboxChildren,\n CheckboxGroupItem,\n CheckboxGroupLabel,\n CheckboxGroupProps,\n CheckboxGroupWrapper,\n ICheckboxValue,\n} from '.';\n\nexport const CheckboxGroup = <T extends ICheckboxValue>(props: CheckboxGroupProps<T>) => {\n const createMarkup = (html: string) => ({ __html: html });\n\n const handleCheckboxChange = useCallback(\n (item: T) => {\n const isSelected = props.value.some((selectedItem) => selectedItem[props.valueField] === item[props.valueField]);\n\n const updatedSelectedItems = isSelected\n ? props.value.filter((selectedItem) => selectedItem[props.valueField] !== item[props.valueField])\n : props.multiple\n ? [...props.value, item]\n : [item];\n if (props.onChange) props.onChange(updatedSelectedItems);\n },\n [props],\n );\n\n const theme = useTheme();\n return (\n <CheckboxGroupWrapper\n className={props.className}\n $sx={props.sx}\n $size={props.size}\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 >\n {props.options.map((e, index) => {\n const isChecked = props.value.some((selectedItem) => selectedItem[props.valueField] === e[props.valueField]);\n return (\n <CheckboxGroupItem key={index} onClick={() => !props.isClickOnlyIcon && handleCheckboxChange(e)}>\n <Checkbox\n genre={props.checkboxGenre}\n isHiddenBorder={props.checkboxIsHiddenBorder}\n view={props.checkBoxView}\n sx={props.checkboxSX}\n size={props.size}\n checked={isChecked}\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 >\n {props.labelField && e?.[props.labelField] !== undefined && (\n <CheckboxGroupLabel dangerouslySetInnerHTML={createMarkup(e[props.labelField] as string)} />\n )}\n </Checkbox>\n {props.childrenField && e?.[props.childrenField] !== undefined && (\n <CheckboxChildren>{e[props.childrenField] as ReactNode}</CheckboxChildren>\n )}\n </CheckboxGroupItem>\n );\n })}\n </CheckboxGroupWrapper>\n );\n};\n"],"names":["CheckboxGroupSize","css","props","CheckboxGroupSizeConstructor","KEY_SIZE_DATA","$size","padding","CheckboxGroupWrapper","styled","div","addFont","addSX","CheckboxGroupItem","CheckboxGroupLabel","CheckboxChildren","handleCheckboxChange","useCallback","item","updatedSelectedItems","value","some","selectedItem","valueField","filter","multiple","onChange","theme","useTheme","jsx","className","$sx","sx","size","$font","_a","font","weight","_b","family","_c","height","_d","children","options","map","e","index","isChecked","jsxs","onClick","isClickOnlyIcon","Checkbox","genre","checkboxGenre","isHiddenBorder","checkboxIsHiddenBorder","view","checkBoxView","checkboxSX","checked","labelField","dangerouslySetInnerHTML","html","__html","childrenField"],"mappings":"uQASaA,EAAoBC,EAAAA,GAAAA;IAC5BC,GAAUC,EAA6BC,EAAAA,cAAcF,EAAMG;EAEnDF,EAAgCD,GAAqCD,EAAAA,GAAAA;SACzEC,EAAMI,QAAU;EAIZC,EAAuBC,EAAOC,GAAA;;;;IAIvCT;IACAU;IACAC;EAGSC,EAAoBJ,EAAOC,GAAA;;;;EAM3BI,EAAqBL,EAAOC,GAAA;;EAI5BK,EAAmBN,EAAOC,GAAA;;mDCrBiBP,gBACtD,MAEMa,EAAuBC,EAAAA,YAC1BC,IACC,MAEMC,EAFahB,EAAMiB,MAAMC,KAAMC,GAAiBA,EAAanB,EAAMoB,cAAgBL,EAAKf,EAAMoB,aAGhGpB,EAAMiB,MAAMI,OAAQF,GAAiBA,EAAanB,EAAMoB,cAAgBL,EAAKf,EAAMoB,aACnFpB,EAAMsB,SACJ,IAAItB,EAAMiB,MAAOF,GACjB,CAACA,GACHf,EAAMuB,UAAUvB,EAAMuB,SAASP,IAErC,CAAChB,IAGGwB,EAAQC,EAAAA,WACd,SACEC,kBAAAA,IAACrB,EAAA,CACCsB,UAAW3B,EAAM2B,UACjBC,IAAK5B,EAAM6B,GACX1B,MAAOH,EAAM8B,KACbC,MAAO,CACLD,MAAM,OAAAE,IAAMC,WAAN,EAAAD,EAAYF,OAAQ5B,EAAAA,cAAcF,EAAM8B,MAAMG,KACpDC,QAAQ,OAAAC,EAAAnC,EAAMiC,WAAN,EAAAE,EAAYD,SAAU,IAC9BE,QAAQ,OAAAC,EAAArC,EAAMiC,WAAN,EAAAI,EAAYD,SAAUZ,EAAMS,KAAKG,OACzCE,OAAQ,OAAAC,EAAAvC,EAAMiC,WAAN,EAAAM,EAAYD,QAGrBE,SAAAxC,EAAMyC,QAAQC,IAAI,CAACC,EAAGC,iBACrB,MAAMC,EAAY7C,EAAMiB,MAAMC,KAAMC,GAAiBA,EAAanB,EAAMoB,cAAgBuB,EAAE3C,EAAMoB,aAChG,OACE0B,yBAACpC,GAA8BqC,QAAS,KAAO/C,EAAMgD,iBAAmBnC,EAAqB8B,GAC3FH,SAAA,GAAAd,kBAAAA,IAACuB,EAAAA,SAAA,CACCC,MAAOlD,EAAMmD,cACbC,eAAgBpD,EAAMqD,uBACtBC,KAAMtD,EAAMuD,aACZ1B,GAAI7B,EAAMwD,WACV1B,KAAM9B,EAAM8B,KACZ2B,QAASZ,EACTZ,KAAM,CACJH,MAAM,OAAAE,EAAAhC,EAAMiC,WAAN,EAAAD,EAAYF,OAAQ5B,EAAAA,cAAcF,EAAM8B,MAAMG,KACpDC,QAAQ,OAAAC,EAAAnC,EAAMiC,WAAN,EAAAE,EAAYD,SAAU,IAC9BE,QAAQ,OAAAC,EAAArC,EAAMiC,aAANI,EAAYD,SAAUZ,EAAMS,KAAKG,OACzCE,OAAQ,OAAAC,EAAAvC,EAAMiC,aAANM,EAAYD,QAGrBE,SAAAxC,EAAM0D,iBAAwC,WAA1Bf,WAAI3C,EAAM0D,cAC7BhC,EAAAA,kBAAAA,IAACf,EAAA,CAAmBgD,yBAhDZC,EAgDkDjB,EAAE3C,EAAM0D,YAhD1D,CAAoBG,OAAQD,QAmDvC5D,EAAM8D,oBAA8C,KAA7B,MAAAnB,OAAA,EAAAA,EAAI3C,EAAM8D,iBAChCpC,wBAACd,EAAA,CAAkB4B,SAAAG,EAAE3C,EAAM8D,mBApBPlB,GAhCX,IAACgB"}

package/build/{component.styles-DkL2qYQQ.js → component.styles-DjoG6jr2.js} RENAMED Viewed

@@ -2,8 +2,8 @@ import { j as jsxRuntimeExports } from "./jsx-runtime-BrDlu8eK.js";
 import { useCallback } from "react";
 import { b as Stack } from "./component-jPZYT5iL.js";
 import styled, { css } from "styled-components";
-import { I as Icon } from "./component.styles-DYAuT7U2.js";
-import { b as addTransition } from "./style-BgcnmVAY.js";
+import { I as Icon } from "./component.styles-DS0ofW1Y.js";
+import { b as addTransition } from "./style-RL73t3JD.js";
 const Accordion = (props) => {
   const onClickSummary = useCallback(() => {
     if (props.onClickSummary) props.onClickSummary();
@@ -78,4 +78,4 @@ export {
   AccordionDetails as d,
   AccordionStyledIcon as e
 };
-//# sourceMappingURL=component.styles-DkL2qYQQ.js.map
+//# sourceMappingURL=component.styles-DjoG6jr2.js.map

package/build/{component.styles-DkL2qYQQ.js.map → component.styles-DjoG6jr2.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"component.styles-~~DkL2qYQQ~~.js","sources":["../src/components/accordion/component.tsx","../src/components/accordion/component.styles.ts"],"sourcesContent":["import React, { FC, useCallback } from 'react'\n\nimport { Stack } from '@local/components/stack'\n\nimport {\n AccordionDetails,\n AccordionProps,\n AccordionStyledIcon,\n AccordionSummary,\n AccordionSummaryContent,\n AccordionWrapper\n} from '.'\n\nexport const Accordion: FC<AccordionProps> = props => {\n const onClickSummary = useCallback(() => {\n if (props.onClickSummary) props.onClickSummary()\n }, [props])\n\n const onClickIcon = useCallback(\n (event: React.MouseEvent<SVGSVGElement>) => {\n if (props.onClickIcon) {\n event.stopPropagation()\n\n props.onClickIcon()\n }\n },\n [props]\n )\n\n return (\n <Stack {...props.wrapperProps}>\n <AccordionWrapper>\n <AccordionSummary onClick={onClickSummary}>\n <AccordionSummaryContent $isAccordionIcon={props.isAccordionIcon}>\n {props.accordionSummary}\n </AccordionSummaryContent>\n {props.isAccordionIcon && (\n <AccordionStyledIcon\n $expanded={props.expanded}\n onClick={onClickIcon}\n name=\"Arrow1\"\n primaryColor=\"black100\"\n type=\"id\"\n size=\"large\"\n />\n )}\n </AccordionSummary>\n <AccordionDetails $expanded={props.expanded}>{props.accordionDetails}</AccordionDetails>\n </AccordionWrapper>\n </Stack>\n )\n}\n","import styled, { css } from 'styled-components'\n\nimport { Icon } from '@local/components/icon'\nimport { addTransition } from '@local/styles/add'\n\nimport { AccordionDetailsProps, AccordionStyledIconProps, AccordionSummaryContentProps } from '.'\n\nexport const AccordionWrapper = styled.div`\n display: flex;\n flex-direction: column;\n width: 100%;\n`\nexport const AccordionSummary = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n user-select: none;\n`\nexport const AccordionSummaryContent = styled.div<AccordionSummaryContentProps>`\n width: 100%;\n\n ${props =>\n props.$isAccordionIcon &&\n css`\n width: calc(100% - 26px);\n `}\n`\nexport const AccordionDetails = styled.div<AccordionDetailsProps>`\n max-height: ${props => (props.$expanded ? '9999px' : '0')};\n height: ${props => (props.$expanded ? '100%' : '0')};\n opacity: ${props => (props.$expanded ? 1 : 0)};\n overflow: hidden;\n ${addTransition};\n`\nexport const AccordionStyledIcon = styled(Icon)<AccordionStyledIconProps>`\n padding: 4px;\n box-sizing: content-box;\n cursor: pointer;\n ${props =>\n props.$expanded\n ? css`\n transform: rotate(180deg);\n `\n : css`\n transform: rotate(0deg);\n `}\n`\n"],"names":["jsxs","jsx"],"mappings":";;;;;;AAaO,MAAM,YAAgC,CAAA,UAAS;AACpD,QAAM,iBAAiB,YAAY,MAAM;AACvC,QAAI,MAAM,eAAgB,OAAM,eAAA;AAAA,EAAe,GAC9C,CAAC,KAAK,CAAC;AAEV,QAAM,cAAc;AAAA,IAClB,CAAC,UAA2C;AAC1C,UAAI,MAAM,aAAa;AACrB,cAAM,gBAAA;AAEN,cAAM,YAAA;AAAA,MAAY;AAAA,IACpB;AAAA,IAEF,CAAC,KAAK;AAAA,EAAA;AAGR,+CACG,OAAA,EAAO,GAAG,MAAM,cACf,iDAAC,kBAAA,EACC,UAAA;AAAA,IAAAA,kCAAAA,KAAC,kBAAA,EAAiB,SAAS,gBACzB,UAAA;AAAA,MAAAC,sCAAC,yBAAA,EAAwB,kBAAkB,MAAM,iBAC9C,gBAAM,kBACT;AAAA,MACC,MAAM,mBACLA,kCAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,MAAM;AAAA,UACjB,SAAS;AAAA,UACT,MAAK;AAAA,UACL,cAAa;AAAA,UACb,MAAK;AAAA,UACL,MAAK;AAAA,QAAA;AAAA,MAAA;AAAA,IACP,GAEJ;AAAA,0CACC,kBAAA,EAAiB,WAAW,MAAM,UAAW,gBAAM,iBAAA,CAAiB;AAAA,EAAA,EAAA,CACvE,EAAA,CACF;AAEJ;AC5CO,MAAM,mBAAmB,OAAO;AAAA;AAAA;AAAA;AAAA;AAKhC,MAAM,mBAAmB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAMhC,MAAM,0BAA0B,OAAO;AAAA;AAAA;AAAA,IAG1C,CAAA,UACA,MAAM,oBACN;AAAA;AAAA,KAEC;AAAA;AAEE,MAAM,mBAAmB,OAAO;AAAA,gBACvB,CAAA,UAAU,MAAM,YAAY,WAAW,GAAI;AAAA,YAC/C,CAAA,UAAU,MAAM,YAAY,SAAS,GAAI;AAAA,aACxC,CAAA,UAAU,MAAM,YAAY,IAAI,CAAE;AAAA;AAAA,IAE3C,aAAa;AAAA;AAEV,MAAM,sBAAsB,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA,IAI1C,CAAA,UACA,MAAM,YACF;AAAA;AAAA,YAGA;AAAA;AAAA,SAEC;AAAA;"}
1	+ {"version":3,"file":"component.styles-DjoG6jr2.js","sources":["../src/components/accordion/component.tsx","../src/components/accordion/component.styles.ts"],"sourcesContent":["import React, { FC, useCallback } from 'react'\n\nimport { Stack } from '@local/components/stack'\n\nimport {\n AccordionDetails,\n AccordionProps,\n AccordionStyledIcon,\n AccordionSummary,\n AccordionSummaryContent,\n AccordionWrapper\n} from '.'\n\nexport const Accordion: FC<AccordionProps> = props => {\n const onClickSummary = useCallback(() => {\n if (props.onClickSummary) props.onClickSummary()\n }, [props])\n\n const onClickIcon = useCallback(\n (event: React.MouseEvent<SVGSVGElement>) => {\n if (props.onClickIcon) {\n event.stopPropagation()\n\n props.onClickIcon()\n }\n },\n [props]\n )\n\n return (\n <Stack {...props.wrapperProps}>\n <AccordionWrapper>\n <AccordionSummary onClick={onClickSummary}>\n <AccordionSummaryContent $isAccordionIcon={props.isAccordionIcon}>\n {props.accordionSummary}\n </AccordionSummaryContent>\n {props.isAccordionIcon && (\n <AccordionStyledIcon\n $expanded={props.expanded}\n onClick={onClickIcon}\n name=\"Arrow1\"\n primaryColor=\"black100\"\n type=\"id\"\n size=\"large\"\n />\n )}\n </AccordionSummary>\n <AccordionDetails $expanded={props.expanded}>{props.accordionDetails}</AccordionDetails>\n </AccordionWrapper>\n </Stack>\n )\n}\n","import styled, { css } from 'styled-components'\n\nimport { Icon } from '@local/components/icon'\nimport { addTransition } from '@local/styles/add'\n\nimport { AccordionDetailsProps, AccordionStyledIconProps, AccordionSummaryContentProps } from '.'\n\nexport const AccordionWrapper = styled.div`\n display: flex;\n flex-direction: column;\n width: 100%;\n`\nexport const AccordionSummary = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n user-select: none;\n`\nexport const AccordionSummaryContent = styled.div<AccordionSummaryContentProps>`\n width: 100%;\n\n ${props =>\n props.$isAccordionIcon &&\n css`\n width: calc(100% - 26px);\n `}\n`\nexport const AccordionDetails = styled.div<AccordionDetailsProps>`\n max-height: ${props => (props.$expanded ? '9999px' : '0')};\n height: ${props => (props.$expanded ? '100%' : '0')};\n opacity: ${props => (props.$expanded ? 1 : 0)};\n overflow: hidden;\n ${addTransition};\n`\nexport const AccordionStyledIcon = styled(Icon)<AccordionStyledIconProps>`\n padding: 4px;\n box-sizing: content-box;\n cursor: pointer;\n ${props =>\n props.$expanded\n ? css`\n transform: rotate(180deg);\n `\n : css`\n transform: rotate(0deg);\n `}\n`\n"],"names":["jsxs","jsx"],"mappings":";;;;;;AAaO,MAAM,YAAgC,CAAA,UAAS;AACpD,QAAM,iBAAiB,YAAY,MAAM;AACvC,QAAI,MAAM,eAAgB,OAAM,eAAA;AAAA,EAAe,GAC9C,CAAC,KAAK,CAAC;AAEV,QAAM,cAAc;AAAA,IAClB,CAAC,UAA2C;AAC1C,UAAI,MAAM,aAAa;AACrB,cAAM,gBAAA;AAEN,cAAM,YAAA;AAAA,MAAY;AAAA,IACpB;AAAA,IAEF,CAAC,KAAK;AAAA,EAAA;AAGR,+CACG,OAAA,EAAO,GAAG,MAAM,cACf,iDAAC,kBAAA,EACC,UAAA;AAAA,IAAAA,kCAAAA,KAAC,kBAAA,EAAiB,SAAS,gBACzB,UAAA;AAAA,MAAAC,sCAAC,yBAAA,EAAwB,kBAAkB,MAAM,iBAC9C,gBAAM,kBACT;AAAA,MACC,MAAM,mBACLA,kCAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,MAAM;AAAA,UACjB,SAAS;AAAA,UACT,MAAK;AAAA,UACL,cAAa;AAAA,UACb,MAAK;AAAA,UACL,MAAK;AAAA,QAAA;AAAA,MAAA;AAAA,IACP,GAEJ;AAAA,0CACC,kBAAA,EAAiB,WAAW,MAAM,UAAW,gBAAM,iBAAA,CAAiB;AAAA,EAAA,EAAA,CACvE,EAAA,CACF;AAEJ;AC5CO,MAAM,mBAAmB,OAAO;AAAA;AAAA;AAAA;AAAA;AAKhC,MAAM,mBAAmB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAMhC,MAAM,0BAA0B,OAAO;AAAA;AAAA;AAAA,IAG1C,CAAA,UACA,MAAM,oBACN;AAAA;AAAA,KAEC;AAAA;AAEE,MAAM,mBAAmB,OAAO;AAAA,gBACvB,CAAA,UAAU,MAAM,YAAY,WAAW,GAAI;AAAA,YAC/C,CAAA,UAAU,MAAM,YAAY,SAAS,GAAI;AAAA,aACxC,CAAA,UAAU,MAAM,YAAY,IAAI,CAAE;AAAA;AAAA,IAE3C,aAAa;AAAA;AAEV,MAAM,sBAAsB,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA,IAI1C,CAAA,UACA,MAAM,YACF;AAAA;AAAA,YAGA;AAAA;AAAA,SAEC;AAAA;"}

package/build/{component.styles-R92hjRRA.cjs → component.styles-Dpo373cZ.cjs} RENAMED Viewed

@@ -1,4 +1,4 @@
-"use strict";const e=require("./jsx-runtime-BcGej2Kr.cjs"),o=require("react"),n=require("./component-BV_7tGiu.cjs"),r=require("styled-components"),c=require("./component.styles-CbkvPvEl.cjs"),i=require("./style-mc2ST5fY.cjs"),s=r.div`
+"use strict";const e=require("./jsx-runtime-BcGej2Kr.cjs"),o=require("react"),n=require("./component-BV_7tGiu.cjs"),r=require("styled-components"),c=require("./component.styles-BKnUDWqO.cjs"),i=require("./style-Df37KnoJ.cjs"),s=r.div`
   display: flex;
   flex-direction: column;
   width: 100%;
@@ -29,4 +29,4 @@
           transform: rotate(0deg);
         `}
 `;exports.Accordion=r=>{const c=o.useCallback(()=>{r.onClickSummary&&r.onClickSummary()},[r]),i=o.useCallback(e=>{r.onClickIcon&&(e.stopPropagation(),r.onClickIcon())},[r]);return e.jsxRuntimeExports.jsx(n.Stack,{...r.wrapperProps,children:e.jsxRuntimeExports.jsxs(s,{children:[e.jsxRuntimeExports.jsxs(t,{onClick:c,children:[e.jsxRuntimeExports.jsx(d,{$isAccordionIcon:r.isAccordionIcon,children:r.accordionSummary}),r.isAccordionIcon&&e.jsxRuntimeExports.jsx(x,{$expanded:r.expanded,onClick:i,name:"Arrow1",primaryColor:"black100",type:"id",size:"large"})]}),e.jsxRuntimeExports.jsx(a,{$expanded:r.expanded,children:r.accordionDetails})]})})},exports.AccordionDetails=a,exports.AccordionStyledIcon=x,exports.AccordionSummary=t,exports.AccordionSummaryContent=d,exports.AccordionWrapper=s;
-//# sourceMappingURL=component.styles-R92hjRRA.cjs.map
+//# sourceMappingURL=component.styles-Dpo373cZ.cjs.map

package/build/{component.styles-R92hjRRA.cjs.map → component.styles-Dpo373cZ.cjs.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"component.styles-~~R92hjRRA~~.cjs","sources":["../src/components/accordion/component.styles.ts","../src/components/accordion/component.tsx"],"sourcesContent":["import styled, { css } from 'styled-components'\n\nimport { Icon } from '@local/components/icon'\nimport { addTransition } from '@local/styles/add'\n\nimport { AccordionDetailsProps, AccordionStyledIconProps, AccordionSummaryContentProps } from '.'\n\nexport const AccordionWrapper = styled.div`\n display: flex;\n flex-direction: column;\n width: 100%;\n`\nexport const AccordionSummary = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n user-select: none;\n`\nexport const AccordionSummaryContent = styled.div<AccordionSummaryContentProps>`\n width: 100%;\n\n ${props =>\n props.$isAccordionIcon &&\n css`\n width: calc(100% - 26px);\n `}\n`\nexport const AccordionDetails = styled.div<AccordionDetailsProps>`\n max-height: ${props => (props.$expanded ? '9999px' : '0')};\n height: ${props => (props.$expanded ? '100%' : '0')};\n opacity: ${props => (props.$expanded ? 1 : 0)};\n overflow: hidden;\n ${addTransition};\n`\nexport const AccordionStyledIcon = styled(Icon)<AccordionStyledIconProps>`\n padding: 4px;\n box-sizing: content-box;\n cursor: pointer;\n ${props =>\n props.$expanded\n ? css`\n transform: rotate(180deg);\n `\n : css`\n transform: rotate(0deg);\n `}\n`\n","import React, { FC, useCallback } from 'react'\n\nimport { Stack } from '@local/components/stack'\n\nimport {\n AccordionDetails,\n AccordionProps,\n AccordionStyledIcon,\n AccordionSummary,\n AccordionSummaryContent,\n AccordionWrapper\n} from '.'\n\nexport const Accordion: FC<AccordionProps> = props => {\n const onClickSummary = useCallback(() => {\n if (props.onClickSummary) props.onClickSummary()\n }, [props])\n\n const onClickIcon = useCallback(\n (event: React.MouseEvent<SVGSVGElement>) => {\n if (props.onClickIcon) {\n event.stopPropagation()\n\n props.onClickIcon()\n }\n },\n [props]\n )\n\n return (\n <Stack {...props.wrapperProps}>\n <AccordionWrapper>\n <AccordionSummary onClick={onClickSummary}>\n <AccordionSummaryContent $isAccordionIcon={props.isAccordionIcon}>\n {props.accordionSummary}\n </AccordionSummaryContent>\n {props.isAccordionIcon && (\n <AccordionStyledIcon\n $expanded={props.expanded}\n onClick={onClickIcon}\n name=\"Arrow1\"\n primaryColor=\"black100\"\n type=\"id\"\n size=\"large\"\n />\n )}\n </AccordionSummary>\n <AccordionDetails $expanded={props.expanded}>{props.accordionDetails}</AccordionDetails>\n </AccordionWrapper>\n </Stack>\n )\n}\n"],"names":["AccordionWrapper","styled","div","AccordionSummary","AccordionSummaryContent","props","$isAccordionIcon","css","AccordionDetails","$expanded","addTransition","AccordionStyledIcon","Icon","onClickSummary","useCallback","onClickIcon","event","stopPropagation","Stack","wrapperProps","children","jsxs","onClick","jsx","isAccordionIcon","accordionSummary","expanded","name","primaryColor","type","size","accordionDetails"],"mappings":"kOAOaA,EAAmBC,EAAOC,GAAA;;;;EAK1BC,EAAmBF,EAAOC,GAAA;;;;;EAM1BE,EAA0BH,EAAOC,GAAA;;;IAG1CG,GACAA,EAAMC,kBACNC,EAAAA,GAAAA;;;EAISC,EAAmBP,EAAOC,GAAA;gBACvBG,GAAUA,EAAMI,UAAY,SAAW;YAC3CJ,GAAUA,EAAMI,UAAY,OAAS;aACpCJ,GAAUA,EAAMI,UAAY,EAAI;;IAEzCC;EAESC,EAAsBV,EAAOW,OAAI;;;;IAI1CP,GACAA,EAAMI,UACFF,EAAAA,GAAAA;;UAGAA,EAAAA,GAAAA;;;oBC9BqCF,IAC3C,MAAMQ,EAAiBC,EAAAA,YAAY,KAC7BT,EAAMQ,gBAAgBR,EAAMQ,kBAC/B,CAACR,IAEEU,EAAcD,EAAAA,YACjBE,IACKX,EAAMU,cACRC,EAAMC,kBAENZ,EAAMU,gBAGV,CAACV,IAGH,+BACGa,QAAA,IAAUb,EAAMc,aACfC,kCAACpB,EAAA,CACCoB,SAAA,GAAAC,kBAAAA,KAAClB,EAAA,CAAiBmB,QAAST,EACzBO,SAAA,CAAAG,wBAACnB,EAAA,CAAwBE,iBAAkBD,EAAMmB,gBAC9CJ,WAAMK,mBAERpB,EAAMmB,iBACLD,EAAAA,kBAAAA,IAACZ,EAAA,CACCF,UAAWJ,EAAMqB,SACjBJ,QAASP,EACTY,KAAK,SACLC,aAAa,WACbC,KAAK,KACLC,KAAK,qCAIVtB,EAAA,CAAiBC,UAAWJ,EAAMqB,SAAWN,WAAMW"}
1	+ {"version":3,"file":"component.styles-Dpo373cZ.cjs","sources":["../src/components/accordion/component.styles.ts","../src/components/accordion/component.tsx"],"sourcesContent":["import styled, { css } from 'styled-components'\n\nimport { Icon } from '@local/components/icon'\nimport { addTransition } from '@local/styles/add'\n\nimport { AccordionDetailsProps, AccordionStyledIconProps, AccordionSummaryContentProps } from '.'\n\nexport const AccordionWrapper = styled.div`\n display: flex;\n flex-direction: column;\n width: 100%;\n`\nexport const AccordionSummary = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n user-select: none;\n`\nexport const AccordionSummaryContent = styled.div<AccordionSummaryContentProps>`\n width: 100%;\n\n ${props =>\n props.$isAccordionIcon &&\n css`\n width: calc(100% - 26px);\n `}\n`\nexport const AccordionDetails = styled.div<AccordionDetailsProps>`\n max-height: ${props => (props.$expanded ? '9999px' : '0')};\n height: ${props => (props.$expanded ? '100%' : '0')};\n opacity: ${props => (props.$expanded ? 1 : 0)};\n overflow: hidden;\n ${addTransition};\n`\nexport const AccordionStyledIcon = styled(Icon)<AccordionStyledIconProps>`\n padding: 4px;\n box-sizing: content-box;\n cursor: pointer;\n ${props =>\n props.$expanded\n ? css`\n transform: rotate(180deg);\n `\n : css`\n transform: rotate(0deg);\n `}\n`\n","import React, { FC, useCallback } from 'react'\n\nimport { Stack } from '@local/components/stack'\n\nimport {\n AccordionDetails,\n AccordionProps,\n AccordionStyledIcon,\n AccordionSummary,\n AccordionSummaryContent,\n AccordionWrapper\n} from '.'\n\nexport const Accordion: FC<AccordionProps> = props => {\n const onClickSummary = useCallback(() => {\n if (props.onClickSummary) props.onClickSummary()\n }, [props])\n\n const onClickIcon = useCallback(\n (event: React.MouseEvent<SVGSVGElement>) => {\n if (props.onClickIcon) {\n event.stopPropagation()\n\n props.onClickIcon()\n }\n },\n [props]\n )\n\n return (\n <Stack {...props.wrapperProps}>\n <AccordionWrapper>\n <AccordionSummary onClick={onClickSummary}>\n <AccordionSummaryContent $isAccordionIcon={props.isAccordionIcon}>\n {props.accordionSummary}\n </AccordionSummaryContent>\n {props.isAccordionIcon && (\n <AccordionStyledIcon\n $expanded={props.expanded}\n onClick={onClickIcon}\n name=\"Arrow1\"\n primaryColor=\"black100\"\n type=\"id\"\n size=\"large\"\n />\n )}\n </AccordionSummary>\n <AccordionDetails $expanded={props.expanded}>{props.accordionDetails}</AccordionDetails>\n </AccordionWrapper>\n </Stack>\n )\n}\n"],"names":["AccordionWrapper","styled","div","AccordionSummary","AccordionSummaryContent","props","$isAccordionIcon","css","AccordionDetails","$expanded","addTransition","AccordionStyledIcon","Icon","onClickSummary","useCallback","onClickIcon","event","stopPropagation","Stack","wrapperProps","children","jsxs","onClick","jsx","isAccordionIcon","accordionSummary","expanded","name","primaryColor","type","size","accordionDetails"],"mappings":"kOAOaA,EAAmBC,EAAOC,GAAA;;;;EAK1BC,EAAmBF,EAAOC,GAAA;;;;;EAM1BE,EAA0BH,EAAOC,GAAA;;;IAG1CG,GACAA,EAAMC,kBACNC,EAAAA,GAAAA;;;EAISC,EAAmBP,EAAOC,GAAA;gBACvBG,GAAUA,EAAMI,UAAY,SAAW;YAC3CJ,GAAUA,EAAMI,UAAY,OAAS;aACpCJ,GAAUA,EAAMI,UAAY,EAAI;;IAEzCC;EAESC,EAAsBV,EAAOW,OAAI;;;;IAI1CP,GACAA,EAAMI,UACFF,EAAAA,GAAAA;;UAGAA,EAAAA,GAAAA;;;oBC9BqCF,IAC3C,MAAMQ,EAAiBC,EAAAA,YAAY,KAC7BT,EAAMQ,gBAAgBR,EAAMQ,kBAC/B,CAACR,IAEEU,EAAcD,EAAAA,YACjBE,IACKX,EAAMU,cACRC,EAAMC,kBAENZ,EAAMU,gBAGV,CAACV,IAGH,+BACGa,QAAA,IAAUb,EAAMc,aACfC,kCAACpB,EAAA,CACCoB,SAAA,GAAAC,kBAAAA,KAAClB,EAAA,CAAiBmB,QAAST,EACzBO,SAAA,CAAAG,wBAACnB,EAAA,CAAwBE,iBAAkBD,EAAMmB,gBAC9CJ,WAAMK,mBAERpB,EAAMmB,iBACLD,EAAAA,kBAAAA,IAACZ,EAAA,CACCF,UAAWJ,EAAMqB,SACjBJ,QAASP,EACTY,KAAK,SACLC,aAAa,WACbC,KAAK,KACLC,KAAK,qCAIVtB,EAAA,CAAiBC,UAAWJ,EAAMqB,SAAWN,WAAMW"}

package/build/{component.styles-BHBTNQ8p.js → component.styles-VrNFgg1_.js} RENAMED Viewed

@@ -1,12 +1,13 @@
 import { j as jsxRuntimeExports } from "./jsx-runtime-BrDlu8eK.js";
-import { b as ErrorMessage, a as addError } from "./style-CQOBaUTO.js";
-import { m as useMergeRefs, g as getFontSizeStyles } from "./component-Bwu-fBEh.js";
+import { b as ErrorMessage, a as addError } from "./style-uVTmdhsH.js";
+import { u as useMergeRefs } from "./floating-ui.react-Byi6bLb1.js";
 import { useRef, useMemo, useCallback, useEffect } from "react";
 import styled, { useTheme, css } from "styled-components";
-import { c as addTransitionWithoutSize, k as addDisabled, g as addOutlineChildren, i as addRemoveOutline } from "./style-BgcnmVAY.js";
+import { d as addTransitionWithoutSize, l as addDisabled, h as addOutlineChildren, c as addFont, j as addRemoveOutline } from "./style-RL73t3JD.js";
 import { a as addSX } from "./style-plT9Ah7t.js";
-import { K as KEY_SIZE_DATA } from "./theme.global-DuEXPcSK.js";
+import { K as KEY_SIZE_DATA } from "./theme.global-BgERDJ4e.js";
 const TextArea = (props) => {
+  var _a, _b, _c, _d, _e;
   const theme = useTheme();
   const refLocal = useRef(null);
   const ref = useMergeRefs([refLocal, props.ref]);
@@ -29,12 +30,12 @@ const TextArea = (props) => {
   }, [props.isAutoHeight, maxHeight]);
   const handleOnChange = useCallback(
     (value) => {
-      var _a, _b;
+      var _a2, _b2;
       if (props.isNoSpaces) {
         const valueWithoutSpaces = value.replace(/\s+/g, "");
-        (_a = props.onChange) == null ? void 0 : _a.call(props, valueWithoutSpaces);
+        (_a2 = props.onChange) == null ? void 0 : _a2.call(props, valueWithoutSpaces);
       } else {
-        (_b = props.onChange) == null ? void 0 : _b.call(props, value);
+        (_b2 = props.onChange) == null ? void 0 : _b2.call(props, value);
       }
     },
     [props]
@@ -50,6 +51,8 @@ const TextArea = (props) => {
       {
         $isInputEffect: props.isInputEffect,
         $isDisabled: props.isDisabled,
+        $isDisabledOutline: props.isDisabled ?? props.isDisabledOutline,
+        $isOutlineBoxShadow: props.isOutlineBoxShadow,
         $sx: props.sx,
         $genre: props.genre,
         $size: props.size,
@@ -62,6 +65,12 @@ const TextArea = (props) => {
           {
             tabIndex: 0,
             ref,
+            $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) ?? `${lineHeight}px`
+            },
             $lineHeight: lineHeight,
             $isResize: props.isResize,
             $error: props.error,
@@ -95,7 +104,18 @@ const TextArea = (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: ((_e = props.font) == null ? void 0 : _e.family) ?? theme.font.family
+        }
+      }
+    ) : null
   ] });
 };
 const addTextAreaWrapperGenre = css`
@@ -153,12 +173,12 @@ const TextAreaWrapper = styled.div`
 const addTextAreaPlaceholder = css`
   &::placeholder,
   &::-webkit-input-placeholder {
-    ${(props) => getFontSizeStyles(16, props.$isBold ? 500 : 400, props.theme.font.family, props.theme.font.lineHeight)};
+    ${addFont};
     color: ${(props) => props.theme.colors.input[props.$genre].color.placeholder};
     opacity: 1;
   }
   &:-ms-input-placeholder {
-    ${(props) => getFontSizeStyles(16, props.$isBold ? 500 : 400, props.theme.font.family, props.theme.font.lineHeight)};
+    ${addFont};
     color: ${(props) => props.theme.colors.input[props.$genre].color.placeholder};
     opacity: 1;
   }
@@ -193,8 +213,8 @@ const addTextArea = css`
   text-overflow: ellipsis;
   height: auto;
   background-color: transparent;
-  ${(props) => getFontSizeStyles(16, props.$isBold ? 500 : 400, props.theme.font.family, `${props.$lineHeight}px`)};
+  ${addFont};
   ${addTextAreaGenre};
   ${addTextAreaIsResize};
   ${addTextAreaPlaceholder};
@@ -210,4 +230,4 @@ export {
   TextAreaWrapper as a,
   addTextArea as b
 };
-//# sourceMappingURL=component.styles-BHBTNQ8p.js.map
+//# sourceMappingURL=component.styles-VrNFgg1_.js.map

package/build/component.styles-VrNFgg1_.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"component.styles-VrNFgg1_.js","sources":["../src/components/textarea/component.tsx","../src/components/textarea/component.styles.ts"],"sourcesContent":["import { ErrorMessage } from '@local/styles/error';\n\nimport { useMergeRefs } from '@floating-ui/react';\nimport { useCallback, useEffect, useMemo, useRef } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport { StyledTextArea, TextAreaProps, TextAreaWrapper } from '.';\n\nexport const TextArea = (props: TextAreaProps) => {\n const theme = useTheme();\n\n const refLocal = useRef<HTMLTextAreaElement>(null);\n const ref = useMergeRefs([refLocal, props.ref]);\n\n const lineHeight = useMemo(\n () => theme.font.sizeDefault.default * theme.font.lineHeight,\n [theme.font.lineHeight, theme.font.sizeDefault.default],\n );\n const maxHeight = useMemo(() => (props.maxRows ? props.maxRows * lineHeight : 0), [lineHeight, props.maxRows]);\n const minHeight = useMemo(\n () => (props.minRows ? props.minRows * lineHeight : lineHeight),\n [lineHeight, props.minRows],\n );\n\n const resizeTextarea = useCallback(() => {\n const el = refLocal.current;\n if (el && props.isAutoHeight) {\n el.style.height = 'auto';\n const newHeight = Math.min(el.scrollHeight, maxHeight);\n el.style.height = `${newHeight}px`;\n }\n }, [props.isAutoHeight, maxHeight]);\n\n const handleOnChange = useCallback(\n (value: string) => {\n if (props.isNoSpaces) {\n const valueWithoutSpaces = value.replace(/\\s+/g, '');\n props.onChange?.(valueWithoutSpaces);\n } else {\n props.onChange?.(value);\n }\n },\n [props],\n );\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: <explanation>\n useEffect(() => {\n if (props.isAutoHeight) {\n requestAnimationFrame(resizeTextarea);\n }\n }, [props.value, resizeTextarea, props.isAutoHeight]);\n return (\n <>\n <TextAreaWrapper\n $isInputEffect={props.isInputEffect}\n $isDisabled={props.isDisabled}\n $isDisabledOutline={props.isDisabled ?? props.isDisabledOutline}\n $isOutlineBoxShadow={props.isOutlineBoxShadow}\n $sx={props.sx}\n $genre={props.genre}\n $size={props.size}\n $lineHeight={lineHeight}\n $isReadOnly={props.isReadOnly}\n className={props.className}\n tabIndex={-1}\n >\n <StyledTextArea\n tabIndex={0}\n ref={ref}\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 ?? `${lineHeight}px`,\n }}\n $lineHeight={lineHeight}\n $isResize={props.isResize}\n $error={props.error}\n $isInputEffect={props.isInputEffect}\n $isLoading={props.isLoading}\n $genre={props.genre}\n $size={props.size}\n $isBold={props.isBold}\n $isDisabled={props.isDisabled}\n maxLength={props.maxLength}\n minLength={props.minLength}\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 rows={props.minRows}\n placeholder={props.placeholder}\n onChange={(event) => handleOnChange(event.target.value)}\n onBlur={props.onBlur}\n onFocus={props.onFocus}\n onKeyDown={props.onKeyDown}\n name={props.name}\n autoComplete={props.autoComplete}\n id={props.id}\n style={{\n minHeight: `${minHeight}px`,\n maxHeight: props.isResize ? 'none' : props.isAutoHeight ? `${maxHeight}px` : `${minHeight}px`,\n }}\n />\n </TextAreaWrapper>\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","import {\n addDisabled,\n addFont,\n addOutlineChildren,\n addRemoveOutline,\n addTransitionWithoutSize,\n} from '@local/styles/add';\nimport { addError } from '@local/styles/error';\nimport { addSX } from '@local/styles/sx';\nimport { KEY_SIZE_DATA } from '@local/theme';\n\nimport styled, { css } from 'styled-components';\n\nimport { StyledTextAreaProps, TextAreaWrapperProps } from '.';\n\n/****************************************** Wrapper *************************************************/\nconst addTextAreaWrapperGenre = css<TextAreaWrapperProps>`\n ${(props) => css`\n background: ${props.theme.colors.input[props.$genre].background.rest};\n border-color: ${props.theme.colors.input[props.$genre].border.rest};\n color: ${props.theme.colors.input[props.$genre].color.rest};\n\n &:active {\n background: ${props.theme.colors.input[props.$genre].background.rest};\n border-color: ${props.theme.colors.input[props.$genre].border.rest};\n color: ${props.theme.colors.input[props.$genre].color.rest};\n }\n &:hover {\n background: ${props.theme.colors.input[props.$genre].background.hover};\n border-color: ${props.theme.colors.input[props.$genre].border.hover};\n color: ${props.theme.colors.input[props.$genre].color.hover};\n }\n &:focus-visible {\n border-color: ${props.theme.colors.input[props.$genre].border.rest};\n background: ${props.theme.colors.input[props.$genre].background.rest};\n color: ${props.theme.colors.input[props.$genre].color.rest};\n }\n `};\n`;\n\nconst addTextAreaWrapperIsInputEffect = css<Pick<TextAreaWrapperProps, '$isInputEffect'>>`\n ${(props) =>\n props.$isInputEffect &&\n css`\n box-shadow: ${props.theme.effects.input};\n `}\n`;\nconst addTextAreaWrapperSize = css<TextAreaWrapperProps>`\n ${(props) => css`\n padding: ${KEY_SIZE_DATA[props.$size].padding - 4}px ${KEY_SIZE_DATA[props.$size].padding}px ${KEY_SIZE_DATA[props.$size].padding - 4}px ${KEY_SIZE_DATA[props.$size].padding}px;\n border-radius: ${KEY_SIZE_DATA[props.$size].radius}px;\n min-height: ${KEY_SIZE_DATA[props.$size].height}px;\n `};\n`;\n\nexport const TextAreaWrapper = styled.div<TextAreaWrapperProps>`\n border: 1px solid;\n position: relative;\n display: flex;\n align-items: flex-start;\n justify-content: flex-start;\n flex-direction: column;\n overflow: hidden;\n width: 100%;\n ${addTransitionWithoutSize};\n ${addTextAreaWrapperSize};\n ${addTextAreaWrapperGenre};\n ${addTextAreaWrapperIsInputEffect};\n ${addDisabled};\n ${addOutlineChildren};\n ${addSX};\n`;\n\n/****************************************** TextArea *************************************************/\nconst addTextAreaPlaceholder = css<StyledTextAreaProps>`\n &::placeholder,\n &::-webkit-input-placeholder {\n ${addFont};\n color: ${(props) => props.theme.colors.input[props.$genre].color.placeholder};\n opacity: 1;\n }\n &:-ms-input-placeholder {\n ${addFont};\n color: ${(props) => props.theme.colors.input[props.$genre].color.placeholder};\n opacity: 1;\n }\n`;\nconst addTextAreaGenre = css<StyledTextAreaProps>`\n ${(props) => css`\n color: ${props.theme.colors.input[props.$genre].color.rest};\n border-color: transparent;\n &:active {\n color: ${props.theme.colors.input[props.$genre].color.rest};\n }\n &:hover {\n color: ${props.theme.colors.input[props.$genre].color.hover};\n }\n &:focus-visible {\n color: ${props.theme.colors.input[props.$genre].color.rest};\n }\n `};\n`;\nconst addTextAreaIsResize = css<Pick<StyledTextAreaProps, '$isResize'>>`\n ${(props) =>\n !props.$isResize &&\n css`\n resize: none;\n `}\n`;\nexport const addTextArea = css<StyledTextAreaProps>`\n overflow-x: hidden;\n width: -webkit-fill-available;\n padding: 0 !important;\n border: none !important;\n margin: 0 !important;\n white-space: normal;\n text-overflow: ellipsis;\n height: auto;\n background-color: transparent;\n\n ${addFont};\n ${addTextAreaGenre};\n ${addTextAreaIsResize};\n ${addTextAreaPlaceholder};\n ${addRemoveOutline};\n ${addError};\n`;\n\nexport const StyledTextArea = styled.textarea<StyledTextAreaProps>`\n ${addTextArea};\n`;\n"],"names":["_a","_b","jsxs","Fragment","jsx"],"mappings":"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"}

package/build/{component.styles-b_DLfQqU.cjs → component.styles-ZU_GyVub.cjs} RENAMED Viewed

@@ -1,4 +1,4 @@
-"use strict";const e=require("./jsx-runtime-BcGej2Kr.cjs"),r=require("react"),n=require("styled-components"),t=require("./style-BVejuajH.cjs"),o=require("./style-fRZ6xrVp.cjs"),a=n.div`
+"use strict";const e=require("./jsx-runtime-BcGej2Kr.cjs"),r=require("react"),n=require("styled-components"),t=require("./style-D3Lbn1EL.cjs"),o=require("./style-fRZ6xrVp.cjs"),a=n.div`
   position: relative;
   display: flex;
   width: 100%;
@@ -44,4 +44,4 @@
     }
   }
 `;exports.Range=t=>{const{onChange:o}=t,u=r.useCallback((e,r)=>{const n=[...t.values];n[e]=Math.min(t.max,Math.max(t.min,r)),o(n.sort((e,r)=>e-r))},[o,t.max,t.min,t.values]),l=r.useCallback(e=>(e-t.min)/(t.max-t.min)*100,[t.max,t.min]),p=r.useMemo(()=>t.values.map(e=>l(e)),[l,t.values]),d=n.useTheme(),g=d.colors.range[t.genre].track.background.rest,m=d.colors.range[t.genre].track.gradient.rest,c=d.colors.range[t.genre].thumb.border.rest,x=d.colors.range[t.genre].thumb.background.rest,$=r.useMemo(()=>p.map((e,r)=>{const n=0===r,t=r===p.length-1;return n?`${g} 0%, ${g} ${e}%, ${m} ${e}%`:t?`${m} ${e}%, ${g} ${e}%, ${g} 100%`:`${m} ${e}%`}).join(", "),[m,g,p]),h=r.useMemo(()=>`linear-gradient(to right, ${$})`,[$]);return e.jsxRuntimeExports.jsxs(a,{$size:t.size,$sx:t.sx,$error:t.error,onBlur:t.onBlur,children:[t.values.map((r,n)=>e.jsxRuntimeExports.jsx(i,{type:"range",$size:t.size,$genre:t.genre,min:t.min,max:t.max,step:t.step,value:r,onChange:e=>u(n,parseFloat(e.target.value)),style:{zIndex:100+n},$colorBackground:x,$colorBorder:c},n)),e.jsxRuntimeExports.jsx(s,{$size:t.size,$genre:t.genre,style:{background:h}})]})},exports.RangeThumb=i,exports.RangeTrack=s,exports.RangeWrapper=a;
-//# sourceMappingURL=component.styles-b_DLfQqU.cjs.map
+//# sourceMappingURL=component.styles-ZU_GyVub.cjs.map

package/build/{component.styles-b_DLfQqU.cjs.map → component.styles-ZU_GyVub.cjs.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"component.styles-~~b_DLfQqU~~.cjs","sources":["../src/components/range/component.styles.ts","../src/components/range/component.tsx"],"sourcesContent":["import styled from 'styled-components'\n\nimport { addError } from '@local/styles/error'\nimport { addSX } from '@local/styles/sx'\n\nimport { RangeComponentProps, RangeThumbProps, RangeWrapperProps } from '.'\n\nexport const RangeWrapper = styled.div<RangeWrapperProps>`\n position: relative;\n display: flex;\n width: 100%;\n box-sizing: border-box;\n align-items: center;\n height: 20px;\n ${addError};\n ${addSX};\n`\n\nexport const RangeTrack = styled.div<RangeComponentProps>`\n position: absolute;\n height: 3px;\n width: 100%;\n padding: 0px 10px;\n border-radius: 2px;\n`\nexport const RangeThumb = styled.input<RangeThumbProps>`\n position: absolute;\n width: 100%;\n outline: none !important;\n pointer-events: none;\n appearance: none;\n -webkit-appearance: none;\n background: transparent;\n left: 0;\n margin: 0;\n &::-webkit-slider-thumb {\n pointer-events: all;\n width: 16px;\n height: 16px;\n margin: 0;\n padding: 0;\n border-radius: 50%;\n background: ${props => props.$colorBackground};\n border: 3px ${props => props.$colorBorder} solid;\n cursor: pointer;\n -webkit-appearance: none;\n margin-top: 0px;\n transition:\n transform ${props => props.theme.transition.default},\n color ${props => props.theme.transition.default},\n background-color ${props => props.theme.transition.default};\n &:hover {\n transform: scale(1.2);\n }\n }\n`\n","import { useCallback, useMemo } from 'react'\nimport { useTheme } from 'styled-components'\n\nimport { RangeProps, RangeThumb, RangeTrack, RangeWrapper } from '.'\n\nexport const Range = (props: RangeProps) => {\n const { onChange } = props\n const handleChange = useCallback(\n (index: number, newValue: number) => {\n const newValues = [...props.values]\n newValues[index] = Math.min(props.max, Math.max(props.min, newValue))\n onChange(newValues.sort((a, b) => a - b))\n },\n [onChange, props.max, props.min, props.values]\n )\n const getThumbPositionPercent = useCallback(\n (val: number) => ((val - props.min) / (props.max - props.min)) * 100,\n [props.max, props.min]\n )\n const positions = useMemo(\n () => props.values.map(val => getThumbPositionPercent(val)),\n [getThumbPositionPercent, props.values]\n )\n const theme = useTheme()\n\n const colorTrackBackground = theme.colors.range[props.genre].track.background.rest\n const colorTrackGradient = theme.colors.range[props.genre].track.gradient.rest\n const colorThumbBorder = theme.colors.range[props.genre].thumb.border.rest\n const colorThumbBackground = theme.colors.range[props.genre].thumb.background.rest\n\n const trackGradient = useMemo(\n () =>\n positions\n .map((position, idx) => {\n const isFirst = idx === 0\n const isLast = idx === positions.length - 1\n\n if (isFirst)\n return `${colorTrackBackground} 0%, ${colorTrackBackground} ${position}%, ${colorTrackGradient} ${position}%`\n if (isLast)\n return `${colorTrackGradient} ${position}%, ${colorTrackBackground} ${position}%, ${colorTrackBackground} 100%`\n return `${colorTrackGradient} ${position}%`\n })\n .join(', '),\n [colorTrackGradient, colorTrackBackground, positions]\n )\n const gradient = useMemo(() => `linear-gradient(to right, ${trackGradient})`, [trackGradient])\n\n return (\n <RangeWrapper $size={props.size} $sx={props.sx} $error={props.error} onBlur={props.onBlur}>\n {props.values.map((val, idx) => (\n <RangeThumb\n key={idx}\n type=\"range\"\n $size={props.size}\n $genre={props.genre}\n min={props.min}\n max={props.max}\n step={props.step}\n value={val}\n onChange={e => handleChange(idx, parseFloat(e.target.value))}\n style={{ zIndex: 100 + idx }}\n $colorBackground={colorThumbBackground}\n $colorBorder={colorThumbBorder}\n />\n ))}\n <RangeTrack\n $size={props.size}\n $genre={props.genre}\n style={{\n background: gradient\n }}\n />\n </RangeWrapper>\n )\n}\n"],"names":["RangeWrapper","styled","div","addError","addSX","RangeTrack","RangeThumb","input","props","$colorBackground","$colorBorder","theme","transition","default","onChange","handleChange","useCallback","index","newValue","newValues","values","Math","min","max","sort","a","b","getThumbPositionPercent","val","positions","useMemo","map","useTheme","colorTrackBackground","colors","range","genre","track","background","rest","colorTrackGradient","gradient","colorThumbBorder","thumb","border","colorThumbBackground","trackGradient","position","idx","isFirst","isLast","length","join","jsxs","$size","size","$sx","sx","$error","error","onBlur","children","jsx","type","$genre","step","value","parseFloat","e","target","style","zIndex"],"mappings":"iLAOaA,EAAeC,EAAOC,GAAA;;;;;;;IAO/BC;IACAC;EAGSC,EAAaJ,EAAOC,GAAA;;;;;;EAOpBI,EAAaL,EAAOM,KAAA;;;;;;;;;;;;;;;;;kBAiBfC,GAASA,EAAMC;kBACfD,GAASA,EAAME;;;;;kBAKfF,GAASA,EAAMG,MAAMC,WAAWC;cACpCL,GAASA,EAAMG,MAAMC,WAAWC;yBACrBL,GAASA,EAAMG,MAAMC,WAAWC;;;;;gBC7CnCL,IACpB,MAAMM,SAAEA,GAAaN,EACfO,EAAeC,EAAAA,YACnB,CAACC,EAAeC,KACd,MAAMC,EAAY,IAAIX,EAAMY,QAC5BD,EAAUF,GAASI,KAAKC,IAAId,EAAMe,IAAKF,KAAKE,IAAIf,EAAMc,IAAKJ,IAC3DJ,EAASK,EAAUK,KAAK,CAACC,EAAGC,IAAMD,EAAIC,KAExC,CAACZ,EAAUN,EAAMe,IAAKf,EAAMc,IAAKd,EAAMY,SAEnCO,EAA0BX,EAAAA,YAC7BY,IAAkBA,EAAMpB,EAAMc,MAAQd,EAAMe,IAAMf,EAAMc,KAAQ,IACjE,CAACd,EAAMe,IAAKf,EAAMc,MAEdO,EAAYC,EAAAA,QAChB,IAAMtB,EAAMY,OAAOW,IAAIH,GAAOD,EAAwBC,IACtD,CAACD,EAAyBnB,EAAMY,SAE5BT,EAAQqB,EAAAA,WAERC,EAAuBtB,EAAMuB,OAAOC,MAAM3B,EAAM4B,OAAOC,MAAMC,WAAWC,KACxEC,EAAqB7B,EAAMuB,OAAOC,MAAM3B,EAAM4B,OAAOC,MAAMI,SAASF,KACpEG,EAAmB/B,EAAMuB,OAAOC,MAAM3B,EAAM4B,OAAOO,MAAMC,OAAOL,KAChEM,EAAuBlC,EAAMuB,OAAOC,MAAM3B,EAAM4B,OAAOO,MAAML,WAAWC,KAExEO,EAAgBhB,EAAAA,QACpB,IACED,EACGE,IAAI,CAACgB,EAAUC,KACd,MAAMC,EAAkB,IAARD,EACVE,EAASF,IAAQnB,EAAUsB,OAAS,EAE1C,OAAIF,EACK,GAAGhB,SAA4BA,KAAwBc,OAAcP,KAAsBO,KAChGG,EACK,GAAGV,KAAsBO,OAAcd,KAAwBc,OAAcd,SAC/E,GAAGO,KAAsBO,OAEjCK,KAAK,MACV,CAACZ,EAAoBP,EAAsBJ,IAEvCY,EAAWX,EAAAA,QAAQ,IAAM,6BAA6BgB,KAAkB,CAACA,IAE/E,SACEO,kBAAAA,KAACrD,EAAA,CAAasD,MAAO9C,EAAM+C,KAAMC,IAAKhD,EAAMiD,GAAIC,OAAQlD,EAAMmD,MAAOC,OAAQpD,EAAMoD,OAChFC,SAAA,CAAArD,EAAMY,OAAOW,IAAI,CAACH,EAAKoB,MACtBc,kBAAAA,IAACxD,EAAA,CAECyD,KAAK,QACLT,MAAO9C,EAAM+C,KACbS,OAAQxD,EAAM4B,MACdd,IAAKd,EAAMc,IACXC,IAAKf,EAAMe,IACX0C,KAAMzD,EAAMyD,KACZC,MAAOtC,EACPd,YAAeC,EAAaiC,EAAKmB,WAAWC,EAAEC,OAAOH,QACrDI,MAAO,CAAEC,OAAQ,IAAMvB,GACvBvC,iBAAkBoC,EAClBnC,aAAcgC,GAXTM,MAcTc,kBAAAA,IAACzD,EAAA,CACCiD,MAAO9C,EAAM+C,KACbS,OAAQxD,EAAM4B,MACdkC,MAAO,CACLhC,WAAYG"}
1	+ {"version":3,"file":"component.styles-ZU_GyVub.cjs","sources":["../src/components/range/component.styles.ts","../src/components/range/component.tsx"],"sourcesContent":["import styled from 'styled-components'\n\nimport { addError } from '@local/styles/error'\nimport { addSX } from '@local/styles/sx'\n\nimport { RangeComponentProps, RangeThumbProps, RangeWrapperProps } from '.'\n\nexport const RangeWrapper = styled.div<RangeWrapperProps>`\n position: relative;\n display: flex;\n width: 100%;\n box-sizing: border-box;\n align-items: center;\n height: 20px;\n ${addError};\n ${addSX};\n`\n\nexport const RangeTrack = styled.div<RangeComponentProps>`\n position: absolute;\n height: 3px;\n width: 100%;\n padding: 0px 10px;\n border-radius: 2px;\n`\nexport const RangeThumb = styled.input<RangeThumbProps>`\n position: absolute;\n width: 100%;\n outline: none !important;\n pointer-events: none;\n appearance: none;\n -webkit-appearance: none;\n background: transparent;\n left: 0;\n margin: 0;\n &::-webkit-slider-thumb {\n pointer-events: all;\n width: 16px;\n height: 16px;\n margin: 0;\n padding: 0;\n border-radius: 50%;\n background: ${props => props.$colorBackground};\n border: 3px ${props => props.$colorBorder} solid;\n cursor: pointer;\n -webkit-appearance: none;\n margin-top: 0px;\n transition:\n transform ${props => props.theme.transition.default},\n color ${props => props.theme.transition.default},\n background-color ${props => props.theme.transition.default};\n &:hover {\n transform: scale(1.2);\n }\n }\n`\n","import { useCallback, useMemo } from 'react'\nimport { useTheme } from 'styled-components'\n\nimport { RangeProps, RangeThumb, RangeTrack, RangeWrapper } from '.'\n\nexport const Range = (props: RangeProps) => {\n const { onChange } = props\n const handleChange = useCallback(\n (index: number, newValue: number) => {\n const newValues = [...props.values]\n newValues[index] = Math.min(props.max, Math.max(props.min, newValue))\n onChange(newValues.sort((a, b) => a - b))\n },\n [onChange, props.max, props.min, props.values]\n )\n const getThumbPositionPercent = useCallback(\n (val: number) => ((val - props.min) / (props.max - props.min)) * 100,\n [props.max, props.min]\n )\n const positions = useMemo(\n () => props.values.map(val => getThumbPositionPercent(val)),\n [getThumbPositionPercent, props.values]\n )\n const theme = useTheme()\n\n const colorTrackBackground = theme.colors.range[props.genre].track.background.rest\n const colorTrackGradient = theme.colors.range[props.genre].track.gradient.rest\n const colorThumbBorder = theme.colors.range[props.genre].thumb.border.rest\n const colorThumbBackground = theme.colors.range[props.genre].thumb.background.rest\n\n const trackGradient = useMemo(\n () =>\n positions\n .map((position, idx) => {\n const isFirst = idx === 0\n const isLast = idx === positions.length - 1\n\n if (isFirst)\n return `${colorTrackBackground} 0%, ${colorTrackBackground} ${position}%, ${colorTrackGradient} ${position}%`\n if (isLast)\n return `${colorTrackGradient} ${position}%, ${colorTrackBackground} ${position}%, ${colorTrackBackground} 100%`\n return `${colorTrackGradient} ${position}%`\n })\n .join(', '),\n [colorTrackGradient, colorTrackBackground, positions]\n )\n const gradient = useMemo(() => `linear-gradient(to right, ${trackGradient})`, [trackGradient])\n\n return (\n <RangeWrapper $size={props.size} $sx={props.sx} $error={props.error} onBlur={props.onBlur}>\n {props.values.map((val, idx) => (\n <RangeThumb\n key={idx}\n type=\"range\"\n $size={props.size}\n $genre={props.genre}\n min={props.min}\n max={props.max}\n step={props.step}\n value={val}\n onChange={e => handleChange(idx, parseFloat(e.target.value))}\n style={{ zIndex: 100 + idx }}\n $colorBackground={colorThumbBackground}\n $colorBorder={colorThumbBorder}\n />\n ))}\n <RangeTrack\n $size={props.size}\n $genre={props.genre}\n style={{\n background: gradient\n }}\n />\n </RangeWrapper>\n )\n}\n"],"names":["RangeWrapper","styled","div","addError","addSX","RangeTrack","RangeThumb","input","props","$colorBackground","$colorBorder","theme","transition","default","onChange","handleChange","useCallback","index","newValue","newValues","values","Math","min","max","sort","a","b","getThumbPositionPercent","val","positions","useMemo","map","useTheme","colorTrackBackground","colors","range","genre","track","background","rest","colorTrackGradient","gradient","colorThumbBorder","thumb","border","colorThumbBackground","trackGradient","position","idx","isFirst","isLast","length","join","jsxs","$size","size","$sx","sx","$error","error","onBlur","children","jsx","type","$genre","step","value","parseFloat","e","target","style","zIndex"],"mappings":"iLAOaA,EAAeC,EAAOC,GAAA;;;;;;;IAO/BC;IACAC;EAGSC,EAAaJ,EAAOC,GAAA;;;;;;EAOpBI,EAAaL,EAAOM,KAAA;;;;;;;;;;;;;;;;;kBAiBfC,GAASA,EAAMC;kBACfD,GAASA,EAAME;;;;;kBAKfF,GAASA,EAAMG,MAAMC,WAAWC;cACpCL,GAASA,EAAMG,MAAMC,WAAWC;yBACrBL,GAASA,EAAMG,MAAMC,WAAWC;;;;;gBC7CnCL,IACpB,MAAMM,SAAEA,GAAaN,EACfO,EAAeC,EAAAA,YACnB,CAACC,EAAeC,KACd,MAAMC,EAAY,IAAIX,EAAMY,QAC5BD,EAAUF,GAASI,KAAKC,IAAId,EAAMe,IAAKF,KAAKE,IAAIf,EAAMc,IAAKJ,IAC3DJ,EAASK,EAAUK,KAAK,CAACC,EAAGC,IAAMD,EAAIC,KAExC,CAACZ,EAAUN,EAAMe,IAAKf,EAAMc,IAAKd,EAAMY,SAEnCO,EAA0BX,EAAAA,YAC7BY,IAAkBA,EAAMpB,EAAMc,MAAQd,EAAMe,IAAMf,EAAMc,KAAQ,IACjE,CAACd,EAAMe,IAAKf,EAAMc,MAEdO,EAAYC,EAAAA,QAChB,IAAMtB,EAAMY,OAAOW,IAAIH,GAAOD,EAAwBC,IACtD,CAACD,EAAyBnB,EAAMY,SAE5BT,EAAQqB,EAAAA,WAERC,EAAuBtB,EAAMuB,OAAOC,MAAM3B,EAAM4B,OAAOC,MAAMC,WAAWC,KACxEC,EAAqB7B,EAAMuB,OAAOC,MAAM3B,EAAM4B,OAAOC,MAAMI,SAASF,KACpEG,EAAmB/B,EAAMuB,OAAOC,MAAM3B,EAAM4B,OAAOO,MAAMC,OAAOL,KAChEM,EAAuBlC,EAAMuB,OAAOC,MAAM3B,EAAM4B,OAAOO,MAAML,WAAWC,KAExEO,EAAgBhB,EAAAA,QACpB,IACED,EACGE,IAAI,CAACgB,EAAUC,KACd,MAAMC,EAAkB,IAARD,EACVE,EAASF,IAAQnB,EAAUsB,OAAS,EAE1C,OAAIF,EACK,GAAGhB,SAA4BA,KAAwBc,OAAcP,KAAsBO,KAChGG,EACK,GAAGV,KAAsBO,OAAcd,KAAwBc,OAAcd,SAC/E,GAAGO,KAAsBO,OAEjCK,KAAK,MACV,CAACZ,EAAoBP,EAAsBJ,IAEvCY,EAAWX,EAAAA,QAAQ,IAAM,6BAA6BgB,KAAkB,CAACA,IAE/E,SACEO,kBAAAA,KAACrD,EAAA,CAAasD,MAAO9C,EAAM+C,KAAMC,IAAKhD,EAAMiD,GAAIC,OAAQlD,EAAMmD,MAAOC,OAAQpD,EAAMoD,OAChFC,SAAA,CAAArD,EAAMY,OAAOW,IAAI,CAACH,EAAKoB,MACtBc,kBAAAA,IAACxD,EAAA,CAECyD,KAAK,QACLT,MAAO9C,EAAM+C,KACbS,OAAQxD,EAAM4B,MACdd,IAAKd,EAAMc,IACXC,IAAKf,EAAMe,IACX0C,KAAMzD,EAAMyD,KACZC,MAAOtC,EACPd,YAAeC,EAAaiC,EAAKmB,WAAWC,EAAEC,OAAOH,QACrDI,MAAO,CAAEC,OAAQ,IAAMvB,GACvBvC,iBAAkBoC,EAClBnC,aAAcgC,GAXTM,MAcTc,kBAAAA,IAACzD,EAAA,CACCiD,MAAO9C,EAAM+C,KACbS,OAAQxD,EAAM4B,MACdkC,MAAO,CACLhC,WAAYG"}

package/build/component.styles-gZHy-64x.cjs ADDED Viewed

@@ -0,0 +1,13 @@
+"use strict";const e=require("./jsx-runtime-BcGej2Kr.cjs"),t=require("./style-D3Lbn1EL.cjs"),n=require("react"),r=require("./component--jGdo2yq.cjs");require("./component.styles-BeRVOt5T.cjs");const s=require("styled-components"),l=require("./style-fRZ6xrVp.cjs"),o=require("./theme.global-CcoD5bPP.cjs"),u=s.css`
+  ${e=>i({...o.KEY_SIZE_DATA[e.$size],...e})};
+`,i=e=>s.css`
+  gap: ${e.padding-2}px;
+  width: 100%;
+`,c=s.div`
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  ${u};
+  ${l.addSX};
+`;exports.InputOTP=s=>{var l;const[o,u]=n.useState(new Array(s.length).fill("")),i=n.useRef([]),a=n.useRef(null),g=n.useCallback((e,t)=>{t.preventDefault();const n=t.clipboardData.getData("Text").replace(/\D/g,"").split("");n.length&&u(t=>{var r,l;const o=[...t];let u=e;for(let e=0;e<n.length&&u<o.length;e++)o[u]=n[e],u++;const c=o.join("");return null==(r=s.onChange)||r.call(s,c),o.every(e=>""!==e)&&(null==(l=s.onComplete)||l.call(s,c)),setTimeout(()=>{var e,t;const n=o.findIndex(e=>""===e);-1!==n?null==(e=i.current[n])||e.focus():u<o.length&&(null==(t=i.current[u])||t.focus())},0),o})},[s]),p=n.useCallback((e,t)=>{/^\d*$/.test(t)&&u(n=>{var r;const l=[...n];return l[e]=t.slice(-1),s.onChange&&s.onChange(l.join("")),l.every(e=>""!==e)&&(null==(r=s.onComplete)||r.call(s,l.join(""))),t&&e<n.length-1&&setTimeout(()=>{var t;null==(t=i.current[e+1])||t.focus()},0),l})},[s]),m=n.useCallback(e=>{setTimeout(()=>e.target.setSelectionRange(0,e.target.value.length),0)},[]);return e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(c,{$error:s.error,$size:s.size,id:s.id,ref:a,onBlur:e=>{setTimeout(()=>{var t;a.current&&!a.current.contains(document.activeElement)&&(null==(t=s.onBlur)||t.call(s,e))},0)},onFocus:e=>{setTimeout(()=>{var t,n;(null==(t=a.current)?void 0:t.contains(document.activeElement))&&(null==(n=s.onFocus)||n.call(s,e))},0)},$sx:s.sx,children:o.map((t,n)=>e.jsxRuntimeExports.jsx(r.Input,{isWidthAsHeight:!0,tabIndex:n+1,ref:e=>{i.current[n]=e},variety:"standard",type:"text",inputMode:"numeric",maxLength:1,value:t,onFocus:m,onPaste:e=>g(n,e),onChange:e=>p(n,e),onKeyDown:e=>((e,t)=>{const n=i.current[e];if(n){if("ArrowRight"===t.key){const t=e<o.length-1?e+1:0,n=i.current[t];n&&(n.focus(),setTimeout(()=>n.setSelectionRange(0,n.value.length),0))}if("ArrowLeft"===t.key){const t=e>0?e-1:o.length-1,n=i.current[t];n&&(n.focus(),setTimeout(()=>n.setSelectionRange(0,n.value.length),0))}"Backspace"===t.key&&(n.value?setTimeout(()=>n.setSelectionRange(0,n.value.length),0):e>0&&setTimeout(()=>{const t=i.current[e-1];t&&(t.focus(),t.setSelectionRange(0,t.value.length))},0))}})(n,e),genre:s.genre,size:s.size,font:s.font},n))}),(null==s?void 0:s.error)?e.jsxRuntimeExports.jsx(t.ErrorMessage,{...s.error,size:(null==s?void 0:s.error.size)??s.size,font:{size:12,weight:400,family:null==(l=s.font)?void 0:l.family}}):null]})},exports.InputOTPSize=u,exports.InputOTPSizeConstructor=i,exports.InputOTPWrapper=c;
+//# sourceMappingURL=component.styles-gZHy-64x.cjs.map

package/build/component.styles-gZHy-64x.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"component.styles-gZHy-64x.cjs","sources":["../src/components/input-otp/component.styles.ts","../src/components/input-otp/component.tsx"],"sourcesContent":["import styled, { css } from 'styled-components'\n\nimport { addSX } from '@local/styles/sx'\nimport { IThemeSizePropertyDefault, KEY_SIZE_DATA } from '@local/theme'\n\nimport { InputOTPWrapperProps } from '.'\n\n/****************************************** Size *************************************************/\nexport const InputOTPSize = css<InputOTPWrapperProps>`\n ${props => InputOTPSizeConstructor({ ...KEY_SIZE_DATA[props.$size], ...props })};\n`\nexport const InputOTPSizeConstructor = (props: IThemeSizePropertyDefault & InputOTPWrapperProps) => css`\n gap: ${props.padding - 2}px;\n width: 100%;\n`\n\nexport const InputOTPWrapper = styled.div<InputOTPWrapperProps>`\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n ${InputOTPSize};\n ${addSX};\n`\n","import { ErrorMessage } from '@local/styles/error';\n\nimport { ClipboardEvent, FocusEvent, KeyboardEvent, useCallback, useRef, useState } from 'react';\n\nimport { Input } from '../input';\nimport { InputOTPProps, InputOTPWrapper } from '.';\n\nexport const InputOTP = (props: InputOTPProps) => {\n const [otp, setOtp] = useState<string[]>(new Array(props.length).fill(''));\n const inputsRef = useRef<(HTMLInputElement | null)[]>([]);\n const wrapperRef = useRef<HTMLDivElement | null>(null);\n\n const handlePaste = useCallback(\n (index: number, e: ClipboardEvent<HTMLInputElement>) => {\n e.preventDefault();\n\n const pasteData = e.clipboardData.getData('Text');\n const digits = pasteData.replace(/\\D/g, '').split('');\n\n if (!digits.length) return;\n\n setOtp((prevOtp) => {\n const newOtp = [...prevOtp];\n let currentIndex = index;\n\n for (let i = 0; i < digits.length && currentIndex < newOtp.length; i++) {\n newOtp[currentIndex] = digits[i];\n currentIndex++;\n }\n\n const joined = newOtp.join('');\n\n props.onChange?.(joined);\n\n if (newOtp.every((char) => char !== '')) {\n props.onComplete?.(joined);\n }\n\n setTimeout(() => {\n const firstEmpty = newOtp.findIndex((char) => char === '');\n if (firstEmpty !== -1) {\n inputsRef.current[firstEmpty]?.focus();\n } else if (currentIndex < newOtp.length) {\n inputsRef.current[currentIndex]?.focus();\n }\n }, 0);\n\n return newOtp;\n });\n },\n [props],\n );\n\n const handleChange = useCallback(\n (index: number, value: string) => {\n if (!/^\\d*$/.test(value)) return;\n\n setOtp((prevOtp) => {\n const newOtp = [...prevOtp];\n newOtp[index] = value.slice(-1);\n\n if (props.onChange) {\n props.onChange(newOtp.join(''));\n }\n\n if (newOtp.every((char) => char !== '')) {\n props.onComplete?.(newOtp.join(''));\n }\n\n if (value && index < prevOtp.length - 1) {\n setTimeout(() => {\n inputsRef.current[index + 1]?.focus();\n }, 0);\n }\n\n return newOtp;\n });\n },\n [props],\n );\n\n const handleKeyDown = (index: number, e: KeyboardEvent<HTMLInputElement>) => {\n const input = inputsRef.current[index];\n\n if (!input) return;\n\n if (e.key === 'ArrowRight') {\n const nextIndex = index < otp.length - 1 ? index + 1 : 0;\n const nextInput = inputsRef.current[nextIndex];\n\n if (nextInput) {\n nextInput.focus();\n setTimeout(() => nextInput.setSelectionRange(0, nextInput.value.length), 0);\n }\n }\n\n if (e.key === 'ArrowLeft') {\n const prevIndex = index > 0 ? index - 1 : otp.length - 1;\n const prevInput = inputsRef.current[prevIndex];\n\n if (prevInput) {\n prevInput.focus();\n setTimeout(() => prevInput.setSelectionRange(0, prevInput.value.length), 0);\n }\n }\n\n if (e.key === 'Backspace') {\n if (input.value) {\n setTimeout(() => input.setSelectionRange(0, input.value.length), 0);\n } else if (index > 0) {\n setTimeout(() => {\n const prevInput = inputsRef.current[index - 1];\n if (prevInput) {\n prevInput.focus();\n prevInput.setSelectionRange(0, prevInput.value.length);\n }\n }, 0);\n }\n }\n };\n\n const handleFocusInput = useCallback((e: FocusEvent<HTMLInputElement>) => {\n setTimeout(() => e.target.setSelectionRange(0, e.target.value.length), 0);\n }, []);\n return (\n <>\n <InputOTPWrapper\n $error={props.error}\n $size={props.size}\n id={props.id}\n ref={wrapperRef}\n onBlur={(e) => {\n setTimeout(() => {\n if (wrapperRef.current && !wrapperRef.current.contains(document.activeElement)) {\n props.onBlur?.(e);\n }\n }, 0);\n }}\n onFocus={(e) => {\n setTimeout(() => {\n if (wrapperRef.current?.contains(document.activeElement)) {\n props.onFocus?.(e);\n }\n }, 0);\n }}\n $sx={props.sx}\n >\n {otp.map((digit, index) => (\n <Input\n isWidthAsHeight\n key={index}\n tabIndex={index + 1}\n ref={(el) => {\n inputsRef.current[index] = el;\n }}\n variety='standard'\n type='text'\n inputMode='numeric'\n maxLength={1}\n value={digit}\n onFocus={handleFocusInput}\n onPaste={(e) => handlePaste(index, e)}\n onChange={(value) => handleChange(index, value)}\n onKeyDown={(e) => handleKeyDown(index, e)}\n genre={props.genre}\n size={props.size}\n font={props.font}\n />\n ))}\n </InputOTPWrapper>\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,\n }}\n />\n ) : null}\n </>\n );\n};\n"],"names":["InputOTPSize","css","props","InputOTPSizeConstructor","KEY_SIZE_DATA","$size","padding","InputOTPWrapper","styled","div","addSX","otp","setOtp","useState","Array","length","fill","inputsRef","useRef","wrapperRef","handlePaste","useCallback","index","e","preventDefault","digits","clipboardData","getData","replace","split","prevOtp","newOtp","currentIndex","i","joined","join","_a","onChange","call","every","char","_b","onComplete","setTimeout","firstEmpty","findIndex","current","focus","handleChange","value","test","slice","handleFocusInput","target","setSelectionRange","jsxs","Fragment","children","jsx","$error","error","size","id","ref","onBlur","contains","document","activeElement","onFocus","$sx","sx","map","digit","Input","isWidthAsHeight","tabIndex","el","variety","type","inputMode","maxLength","onPaste","onKeyDown","input","key","nextIndex","nextInput","prevIndex","prevInput","handleKeyDown","genre","font","ErrorMessage","weight","family"],"mappings":"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"}

package/build/{component.styles-CKLd9UoP.cjs → component.styles-iHE8mmya.cjs} RENAMED Viewed

@@ -1,4 +1,4 @@
-"use strict";const e=require("./jsx-runtime-BcGej2Kr.cjs"),t=require("./consts.cjs.js"),s=require("./use-D0mgQexh.cjs"),i=require("./component-CMkU2lIg.cjs"),r=require("./component.styles-DLU0S0KI.cjs"),o=require("./component-BV_7tGiu.cjs"),n=require("styled-components"),a=require("./component-CeWNemV1.cjs"),l=require("./context.constants-CTfUKury.cjs"),d=require("./theme.global-B9wIU_rF.cjs"),u=require("react"),c=require("./style-BVejuajH.cjs"),g=require("framer-motion"),p=require("./style-fRZ6xrVp.cjs"),m=n.css`
+"use strict";const e=require("./jsx-runtime-BcGej2Kr.cjs"),t=require("./consts.cjs.js"),s=require("./use-Dg449cuf.cjs"),i=require("./component-B1bvPlyB.cjs"),r=require("./component.styles-BTsmbWT6.cjs"),o=require("./component-BV_7tGiu.cjs"),n=require("styled-components"),a=require("./component-C67KboOB.cjs"),l=require("./context.constants-ByXsACU7.cjs"),d=require("./theme.global-CcoD5bPP.cjs"),u=require("react"),c=require("./style-D3Lbn1EL.cjs"),g=require("framer-motion"),p=require("./style-fRZ6xrVp.cjs"),m=n.css`
   ${e=>n.css`
     background: ${e.theme.colors.imageSelect[e.$genre].background.rest};
     color: ${e.theme.colors.imageSelect[e.$genre].color.rest};
@@ -16,15 +16,15 @@
 `,h=e=>n.css`
   padding: ${e.padding}px;
   border-radius: ${e.radius}px;
-`,j=n.css`
-  ${e=>f(d.KEY_SIZE_DATA[e.$size])};
-`,f=e=>n.css`
+`,f=n.css`
+  ${e=>j(d.KEY_SIZE_DATA[e.$size])};
+`,j=e=>n.css`
   gap: ${e.padding-2}px;
 `,S=n.div`
   display: flex;
   flex-direction: column;
   width: 100%;
-  ${j};
+  ${f};
   ${c.addError};
   ${p.addSX};
 `,b=n(g.motion.div)`
@@ -35,5 +35,5 @@
   width: 100%;
   ${m}
   ${x}
-`;exports.ImageSelect=p=>{const{onChange:m}=p,x=u.useMemo(()=>d.KEY_SIZE_DATA[p.size],[p.size]),[h,j]=u.useState(p.images||[]),[f,v]=u.useState(!1),$=u.useRef(null),y=n.useTheme(),E=u.useCallback(e=>{e&&j(t=>{const s=e.map((e,s)=>({...e,index:t.length+s})),i=[...t,...s];return null==m||m(i),i})},[m]),z=()=>{var e;null==(e=$.current)||e.click()},{handleAddFiles:R}=s.useImageCrop({onSave:E,locale:p.locale,dialog:{button:{genre:p.propsButton.default.genre,size:p.propsButton.default.size},buttonDelete:{genre:p.propsButton.delete.genre,size:p.propsButton.delete.size}},imageSettings:{maxSize:p.imageSettings.maxSize,maxCount:p.imageSettings.maxCount-h.length,aspect:p.imageSettings.aspect},refInput:$}),{handleAdd:k}=(t=>{const s=u.useMemo(()=>d.KEY_SIZE_DATA[t.size],[t.size]),n=u.useMemo(()=>`${s.radius}px`,[s.radius]),{add:c}=l.useDialog({br:n,propsDialog:{borderRadius:n,padding:"0",background:"whiteStandard"}});return{handleAdd:u.useCallback(s=>{c({content:(n,l)=>e.jsxRuntimeExports.jsxs(o.Stack,{sx:{default:{position:"relative",overflow:"hidden",aspectRatio:2*t.imageSettings.aspect+" / 2",width:"auto",maxWidth:"70dvw",height:"85dvh",borderRadius:null==n?void 0:n.br},tablet:{maxWidth:"95dvw"}},children:[e.jsxRuntimeExports.jsx(r.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==s?void 0:s.imageSrc,src:null==s?void 0:s.imageSrc,componentFallback:e.jsxRuntimeExports.jsx(a.Typography,{sx:{default:{variant:"h6"}},children:t.locale.imageFallback})}),e.jsxRuntimeExports.jsx(i.Button,{sx:{default:{position:"absolute",bottom:15,right:15}},genre:"realebail-white",size:"small",icons:[{type:"id",name:"Arrow4"}],isWidthAsHeight:!0,isHiddenBorder:!0,isRadius:!0,onClick:()=>null==l?void 0:l()})]})})},[c,t.imageSettings.aspect,t.locale.imageFallback])}})({size:p.size,locale:p.locale,imageSettings:p.imageSettings,genre:p.genre});return u.useEffect(()=>{j(p.images||[])},[p.images]),e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs(S,{$genre:p.genre,$size:p.size,id:p.id,$sx:p.sx,$error:p.error,children:[e.jsxRuntimeExports.jsxs(b,{onDrop:e=>{(e=>{var t;e.preventDefault(),(null==(t=e.dataTransfer.files)?void 0:t.length)&&R(e.dataTransfer.files)})(e),v(!1)},onDragOver:e=>e.preventDefault(),onDragEnter:()=>v(!0),onDragLeave:()=>v(!1),animate:{borderColor:f?y.colors.imageSelect[p.genre].border.hover:y.colors.imageSelect[p.genre].border.rest},transition:{duration:.3},$genre:p.genre,$size:p.size,children:[e.jsxRuntimeExports.jsxs(g.motion.div,{transition:{layout:{duration:.3,ease:"easeInOut",type:"spring"}},layout:!0,style:{display:"flex",flexWrap:"wrap",gap:x.padding-2+"px"},children:[h.map(t=>t.url&&e.jsxRuntimeExports.jsxs(g.motion.div,{style:{position:"relative",width:`${p.imageSettings.width}px`,height:`${p.imageSettings.height}px`,userSelect:"none",overflow:"hidden",borderRadius:`${x.radius}px`,flexGrow:1},layout:!0,transition:{layout:{duration:.3,ease:"easeInOut",type:"spring"}},children:[e.jsxRuntimeExports.jsx(r.Image,{sxStack:e=>({default:{width:"100%",height:"100%",alignItems:"center",justifyContent:"center",backgroundColor:e.palette.black10,position:"absolute",pointerEvents:"none"}}),isShowBeforeImage:p.isContain,sxImage:{default:{objectFit:p.isContain?"contain":"cover"}},alt:t.name||"image",src:t.url,componentFallback:e.jsxRuntimeExports.jsx(a.Typography,{sx:{default:{variant:"h6"}},children:p.locale.imageFallback})}),e.jsxRuntimeExports.jsx(i.Button,{sx:{default:{position:"absolute",top:5,right:5}},genre:p.genre,size:"small",icons:[{type:"id",name:"Close"}],isWidthAsHeight:!0,isHiddenBorder:!0,isRadius:!0,onClick:()=>{return e=t.id,void j(t=>{const s=t.filter(t=>t.id!==e);return null==m||m(s),s});var e}}),e.jsxRuntimeExports.jsx(i.Button,{sx:{default:{position:"absolute",bottom:5,right:5}},genre:p.genre,size:"small",icons:[{type:"id",name:"Activity"}],isWidthAsHeight:!0,isHiddenBorder:!0,isRadius:!0,onClick:()=>t.url&&k({id:t.id,imageSrc:t.url})})]},t.id)),0===h.length?e.jsxRuntimeExports.jsx("div",{onClick:z,style:{position:"relative",width:`${p.imageSettings.width}px`,height:`${p.imageSettings.height}px`,userSelect:"none",overflow:"hidden",borderRadius:`${x.radius}px`,flexGrow:1,display:"flex",alignItems:"center",justifyContent:"center",textAlign:"center",cursor:"pointer"},children:e.jsxRuntimeExports.jsx(a.Typography,{style:{color:y.colors.imageSelect[p.genre].color.rest},sx:{default:{}},children:p.locale.dragAndDrop})},"empty"):null]}),e.jsxRuntimeExports.jsx("input",{ref:$,type:"file",accept:t.ImageSupportedFormatsForInput,multiple:!0,style:{display:"none"},onChange:e=>{e.target.files&&R(e.target.files)}})]}),e.jsxRuntimeExports.jsxs(o.Stack,{sx:{default:{flexGrow:1,gap:x.padding-2+"px"}},children:[e.jsxRuntimeExports.jsx(i.Button,{type:"button",genre:p.genre,size:p.size,sx:{default:{flexGrow:3}},isRadius:!0,onClick:z,children:p.locale.buttonAdd}),e.jsxRuntimeExports.jsx(i.Button,{isRadius:!0,type:"button",sx:{default:{flexGrow:1}},onClick:()=>{j(p.defaultImages||[]),null==m||m(p.defaultImages||[])},genre:p.genre,size:p.size,children:p.locale.buttonReset})]})]}),(null==p?void 0:p.error)?e.jsxRuntimeExports.jsx(c.ErrorMessage,{...p.error,size:(null==p?void 0:p.error.size)??p.size}):null]})},exports.ImageSelectListSize=x,exports.ImageSelectListSizeConstructor=h,exports.ImageSelectListWrapper=b,exports.ImageSelectSize=j,exports.ImageSelectSizeConstructor=f,exports.ImageSelectWrapper=S;
-//# sourceMappingURL=component.styles-CKLd9UoP.cjs.map
+`;exports.ImageSelect=p=>{const{onChange:m}=p,x=u.useMemo(()=>d.KEY_SIZE_DATA[p.size],[p.size]),[h,f]=u.useState(p.images||[]),[j,v]=u.useState(!1),y=u.useRef(null),$=n.useTheme(),E=u.useCallback(e=>{e&&f(t=>{const s=e.map((e,s)=>({...e,index:t.length+s})),i=[...t,...s];return null==m||m(i),i})},[m]),z=()=>{var e;null==(e=y.current)||e.click()},{handleAddFiles:R}=s.useImageCrop({onSave:E,locale:p.locale,dialog:{button:{genre:p.propsButton.default.genre,size:p.propsButton.default.size},buttonDelete:{genre:p.propsButton.delete.genre,size:p.propsButton.delete.size}},imageSettings:{maxSize:p.imageSettings.maxSize,maxCount:p.imageSettings.maxCount-h.length,aspect:p.imageSettings.aspect},refInput:y}),{handleAdd:k}=(t=>{const s=u.useMemo(()=>d.KEY_SIZE_DATA[t.size],[t.size]),n=u.useMemo(()=>`${s.radius}px`,[s.radius]),{add:c}=l.useDialog({br:n,propsDialog:{borderRadius:n,padding:"0",background:"whiteStandard"}});return{handleAdd:u.useCallback(s=>{c({content:(n,l)=>e.jsxRuntimeExports.jsxs(o.Stack,{sx:{default:{position:"relative",overflow:"hidden",aspectRatio:2*t.imageSettings.aspect+" / 2",width:"auto",maxWidth:"70dvw",height:"85dvh",borderRadius:null==n?void 0:n.br},tablet:{maxWidth:"95dvw"}},children:[e.jsxRuntimeExports.jsx(r.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==s?void 0:s.imageSrc,src:null==s?void 0:s.imageSrc,componentFallback:e.jsxRuntimeExports.jsx(a.Typography,{sx:{default:{variant:"h6"}},children:t.locale.imageFallback})}),e.jsxRuntimeExports.jsx(i.Button,{sx:{default:{position:"absolute",bottom:15,right:15}},genre:"realebail-white",size:"small",icons:[{type:"id",name:"Arrow4"}],isWidthAsHeight:!0,isHiddenBorder:!0,isRadius:!0,onClick:()=>null==l?void 0:l()})]})})},[c,t.imageSettings.aspect,t.locale.imageFallback])}})({size:p.size,locale:p.locale,imageSettings:p.imageSettings,genre:p.genre});return u.useEffect(()=>{f(p.images||[])},[p.images]),e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs(S,{$genre:p.genre,$size:p.size,id:p.id,$sx:p.sx,$error:p.error,children:[e.jsxRuntimeExports.jsxs(b,{onDrop:e=>{(e=>{var t;e.preventDefault(),(null==(t=e.dataTransfer.files)?void 0:t.length)&&R(e.dataTransfer.files)})(e),v(!1)},onDragOver:e=>e.preventDefault(),onDragEnter:()=>v(!0),onDragLeave:()=>v(!1),animate:{borderColor:j?$.colors.imageSelect[p.genre].border.hover:$.colors.imageSelect[p.genre].border.rest},transition:{duration:.3},$genre:p.genre,$size:p.size,children:[e.jsxRuntimeExports.jsxs(g.motion.div,{transition:{layout:{duration:.3,ease:"easeInOut",type:"spring"}},layout:!0,style:{display:"flex",flexWrap:"wrap",gap:x.padding-2+"px"},children:[h.map(t=>t.url&&e.jsxRuntimeExports.jsxs(g.motion.div,{style:{position:"relative",width:`${p.imageSettings.width}px`,height:`${p.imageSettings.height}px`,userSelect:"none",overflow:"hidden",borderRadius:`${x.radius}px`,flexGrow:1},layout:!0,transition:{layout:{duration:.3,ease:"easeInOut",type:"spring"}},children:[e.jsxRuntimeExports.jsx(r.Image,{sxStack:e=>({default:{width:"100%",height:"100%",alignItems:"center",justifyContent:"center",backgroundColor:e.palette.black10,position:"absolute",pointerEvents:"none"}}),isShowBeforeImage:p.isContain,sxImage:{default:{objectFit:p.isContain?"contain":"cover"}},alt:t.name||"image",src:t.url,componentFallback:e.jsxRuntimeExports.jsx(a.Typography,{sx:{default:{variant:"h6"}},children:p.locale.imageFallback})}),e.jsxRuntimeExports.jsx(i.Button,{sx:{default:{position:"absolute",top:5,right:5}},genre:p.genre,size:"small",icons:[{type:"id",name:"Close"}],isWidthAsHeight:!0,isHiddenBorder:!0,isRadius:!0,onClick:()=>{return e=t.id,void f(t=>{const s=t.filter(t=>t.id!==e);return null==m||m(s),s});var e}}),e.jsxRuntimeExports.jsx(i.Button,{sx:{default:{position:"absolute",bottom:5,right:5}},genre:p.genre,size:"small",icons:[{type:"id",name:"Activity"}],isWidthAsHeight:!0,isHiddenBorder:!0,isRadius:!0,onClick:()=>t.url&&k({id:t.id,imageSrc:t.url})})]},t.id)),0===h.length?e.jsxRuntimeExports.jsx("div",{onClick:z,style:{position:"relative",width:`${p.imageSettings.width}px`,height:`${p.imageSettings.height}px`,userSelect:"none",overflow:"hidden",borderRadius:`${x.radius}px`,flexGrow:1,display:"flex",alignItems:"center",justifyContent:"center",textAlign:"center",cursor:"pointer"},children:e.jsxRuntimeExports.jsx(a.Typography,{style:{color:$.colors.imageSelect[p.genre].color.rest},sx:{default:{}},children:p.locale.dragAndDrop})},"empty"):null]}),e.jsxRuntimeExports.jsx("input",{ref:y,type:"file",accept:t.ImageSupportedFormatsForInput,multiple:!0,style:{display:"none"},onChange:e=>{e.target.files&&R(e.target.files)}})]}),e.jsxRuntimeExports.jsxs(o.Stack,{sx:{default:{flexGrow:1,gap:x.padding-2+"px"}},children:[e.jsxRuntimeExports.jsx(i.Button,{type:"button",genre:p.genre,size:p.size,sx:{default:{flexGrow:3}},isRadius:!0,onClick:z,children:p.locale.buttonAdd}),e.jsxRuntimeExports.jsx(i.Button,{isRadius:!0,type:"button",sx:{default:{flexGrow:1}},onClick:()=>{f(p.defaultImages||[]),null==m||m(p.defaultImages||[])},genre:p.genre,size:p.size,children:p.locale.buttonReset})]})]}),(null==p?void 0:p.error)?e.jsxRuntimeExports.jsx(c.ErrorMessage,{...p.error,size:(null==p?void 0:p.error.size)??p.size,font:{size:12,weight:400,family:$.font.family}}):null]})},exports.ImageSelectListSize=x,exports.ImageSelectListSizeConstructor=h,exports.ImageSelectListWrapper=b,exports.ImageSelectSize=f,exports.ImageSelectSizeConstructor=j,exports.ImageSelectWrapper=S;
+//# sourceMappingURL=component.styles-iHE8mmya.cjs.map